如何在vue项目中格式化时间

1.安装dayjs包

安装格式化时间的第三方包dayjs

npm i [email protected] -S

2.两种方式:

2.1 全局过滤器的使用

在项目入口文件 main.js 中导入并使用 dayjs，定义全局过滤器：

import dayjs from 'dayjs'Vue.filter('dateFormat', date => {return dayjs(date).format('YYYY-MM-DD HH:mm:ss')

在 项目.vue 组件中，调用全局过滤器，对时间进行格式化：

<el-table-column label="发表时间">  <!-- 想要自定义某一列数据要渲染成什么样子，就需要使用插槽 --><template v-slot="scope">    {{ scope.row.pub_date | dateFormat }}

2.2 在项目组件中自定义属性渲染调用方法使用

在 项目.vue 组件中, 导入并使用 dayjs

import dayjs from 'dayjs'

 在组件中使用插槽:

    {{ dateFormat(obj.row.pub_date) }}

 在methods:函数中格式化时间

return dayjs(date).format('YYYY-MM-DD HH:mm:ss')