成功vue日期格式化
Main.js文件中:
import Vue from 'vue'
import 'normalize.css/normalize.css' // A modern alternative to CSS resets
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import '@/styles/index.scss' // global css
import App from './App'
import store from './store'
import router from './router'
import Moment from 'moment';
import '@/icons' // icon
import '@/permission' // permission control
import "@/styles/Common.scss";
import global_ from '@/components/Global';//引用文件
import CommonJs from "@/utils/Common.js";
/**
* If you don't want to use mock-server
* you want to use MockJs for mock api
* you can execute: mockXHR()
*
* Currently MockJs will be used in the production environment,
* please remove it before going online ! ! !
*/
if (process.env.NODE_ENV === 'production') {
const { mockXHR } = require('../mock')
mockXHR()
}
Vue.prototype.GLOBAL = global_;//挂载到Vue实例上面
Vue.prototype.moment = Moment;//引用时间控件
Vue.prototype.CommonJs = CommonJs;//引用公共js文件
Vue.use(ElementUI);
Vue.config.productionTip = false
Vue.filter('dateYMDFormat',function(dateStr,pattern='YYYY-MM-DD'){
return Moment(dateStr).format(pattern);
})
new Vue({
el: '#app',
router,
store,
render: h => h(App)
})
页面中:
<el-table-column
prop="AddTime"
label="建档时间"
>
<template slot-scope="scope">
{{ scope.row.AddTime|dateYMDFormat }}
</template>
</el-table-column>