vue3使用Moment

moment.js是一个JavaScript 日期处理类库。

由于用ant design日期组件取得的值是moment类型,而往数据库中保存需要的是字符串类型.这里就用到了moment日期转换

Moment.js官网:http://momentjs.cn/

安装插件

npm install moment

format就是格式化函数,参数’YYYY-MM-DD HH:mm:ss’定义了返回日期的格式

转换示例

日期格式化

moment().format('MMMM Do YYYY, h:mm:ss a'); // 十月 22日 2021, 3:05:48 下午
moment().format('dddd');                    // 星期五
moment().format("MMM Do YY");               // 10月 22日 21
moment().format('YYYY [escaped] YYYY');     // 2021 escaped 2021
moment().format();                          // 2021-10-22T15:05:48+08:00

相对时间

moment("20111031", "YYYYMMDD").fromNow(); // 10 年前
moment("20120620", "YYYYMMDD").fromNow(); // 9 年前
moment().startOf('day').fromNow();        // 15 小时前
moment().endOf('day').fromNow();          // 9 小时内
moment().startOf('hour').fromNow();       // 6 分钟前

日历时间

moment().subtract(10, 'days').calendar(); // 2021/10/12
moment().subtract(6, 'days').calendar();  // 上星期六15:05
moment().subtract(3, 'days').calendar();  // 上星期二15:05
moment().subtract(1, 'days').calendar();  // 昨天15:05
moment().calendar();                      // 今天15:05
moment().add(1, 'days').calendar();       // 明天15:05
moment().add(3, 'days').calendar();       // 下星期一15:05
moment().add(10, 'days').calendar();      // 2021/11/01

多语言支持

moment.locale();         // zh-cn
moment().format('LT');   // 15:05
moment().format('LTS');  // 15:05:48
moment().format('L');    // 2021/10/22
moment().format('l');    // 2021/10/22
moment().format('LL');   // 2021年10月22日
moment().format('ll');   // 2021年10月22日
moment().format('LLL');  // 2021年10月22日下午3点05分
moment().format('lll');  // 2021年10月22日 15:05
moment().format('LLLL'); // 2021年10月22日星期五下午3点05分
moment().format('llll'); // 2021年10月22日星期五 15:05

antdesign

import moment from 'moment'
async function getTitle() {
  
  await article.getTitles(1, 1000, true, false).then((result: any) => {
  //遍历日期
    result.data.forEach((res: any) => {
      res.timeCreate = moment(res.timeCreate).format('YYYY-MM-DD')
      res.timeModified = moment(res.timeModified).format('YYYY-MM-DD')
    })
    state.dataResult = result.data
  })
}

函数封装

//封装momentData
function momentData(result: any) {
  result.data.forEach((res: any) => {
    res.timeCreate = moment(res.timeCreate).format('YYYY-MM-DD')
    res.timeModified = moment(res.timeModified).format('YYYY-MM-DD')
  })
}
//调用
momentData(result)

你可能感兴趣的:(vue)