ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

vue中使用Moment日期格式化

2022-09-05 14:03:39  阅读:215  来源: 互联网

标签:10 vue 格式化 format 05 moment Moment 2021 15


vue中使用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 GetFySortTitle() {
  
  await article.GetFyTitleAsync(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)

标签:10,vue,格式化,format,05,moment,Moment,2021,15
来源: https://www.cnblogs.com/ouyangkai/p/16657872.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有