vue中使用moment时间戳
1. 安装下载
npm install moment --save
2. 在main.js中引入
import moment from 'moment'
/**
* 时间戳
*/
Vue.filter('dateformat', function (dataStr, pattern = 'YYYY-MM-DD') {
return moment(dataStr).format(pattern)
})
3. 在页面中使用
<el-table
:data="tableData"
border
style="width: 100%"
empty-text="抱歉~~暂无数据"
:header-cell-style="{ background: '#eef1f6', color: '#606266' }"
>
<el-table-column prop="status" label="状态" align="center">
<template slot-scope="scope">
<span v-if="scope.row.status === 1">可用</span>
<span v-if="scope.row.status === 0">不可用</span>
</template>
</el-table-column>
<el-table-column label="最后一次登录时间" width="150" align="center">
<template slot-scope="scope">
<span>{{ scope.row.createTime | dateformat("YYYY-MM-DD") }}</span>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" width="200" align="center">
<template slot-scope="scope">
<el-button
@click="handleClick(scope.row, 'view')"
type="text"
size="small"
>查看</el-button
>
<el-button
type="text"
size="small"
@click="handleClick(scope.row, 'edit')"
>编辑</el-button
>
</template>
</el-table-column>
</el-table>
5. 在普通标签中使用
<FormItem label="生日:" prop="birthday">
<DatePicker
:editable="false"
type="date"
v-if="this.pageType != 'view'"
v-model="ruleForm.birthday"
:start-date="new Date()"
placeholder="选择日期"
style="width: 200px"
></DatePicker>
<span v-if="this.pageType == 'view'">{{
ruleForm.birthday | dateformat("YYYY-MM-DD")
}}</span>
</FormItem>
浙公网安备 33010602011771号