1, 安装时间格式化插件
NPM install vue-moment --save
2, 在 main.JS 中引用
- import moment from 'moment'
- Vue.use(require('vue-moment'));
- Vue.prototype.moment = moment
3, 在 main.JS 中加入日期格式化的过滤器, 其中 dateYMDHMSFormat 为方法名称
- Vue.filter('dateYMDHMSFormat',function(dateStr,pattern='YYYY-MM-DD HH:mm:ss'){
- return moment(dateStr).format(pattern);
- })
4, 普通使用方法, date 为参数名, 后面 dateYMDHMSFormat 为方法名称
<p>{{date | dateYMDHMSFormat}}</p>
但是, 在 table 中需要添加插槽
不加格式化写法:
<el-table-column prop="date" label="时间"></el-table-column>
加入格式化写法:
- <el-table-column prop="date" label="时间">
- <template slot-scope="scope">
- {{scope.row.date| dateYMDHMSFormat}}
- </template>
- </el-table-column>
- ----------------
来源: http://www.bubuko.com/infodetail-3510390.html