vue element-uiを処理し、モーメントを使用してテーブルの時間フォーマットスキームを解決します

 

moment.jsをダウンロード 

npm install moment --save
//或者
yarn add moment --save

main.jsが導入されました

// 导入时间插件momentjs
import moment from 'moment'
 
// 定义全局时间格式过滤器
Vue.filter('dateFormat', function (daraStr, pattern = 'YYYY-MM-DD HH:mm:ss') {
  return moment(daraStr).format(pattern)
})

コンポーネントで使用

<!-- 显示2020-08-31 10:10 -->
 <div class="time">{
   
   {nowDate | dateFormat('YYYY-MM-DD HH:mm')}}</div>

 element-ui形式の処理メソッド:<template> </ template>を使用することを忘れないでください

/*commissionTime是后台返回的时间数据*/
<el-table-column prop="commissionTime" label="委案时间">
   <template slot-scope="scope">{
   
   {scope.row.commissionTime | dateFormat("YYYY-MM-DD")}}</template>
</el-table-column>

コンポーネントのニーズに応じて単一のコンポーネントを導入します。

<script>
let moment = require("moment") // 引入
export default {
    data() {
        return {
            nowDate:new Date().getTime()// 获取时间戳
        }
    },
    created(){
        // 转换时间格式年月日时分秒
        this.nowDate = moment(this.nowDate).format('YYYY-MM-DD HH:mm')
    }
}
</script>

コンポーネント内:

<div class="time">{
   
   {nowDate}}</div>

 

おすすめ

転載: blog.csdn.net/SmartJunTao/article/details/108321190