vue中使用day.js(时间日期处理库)

1 篇文章 0 订阅

安装:npm install dayjs --save

引入:

var dayjs = require('dayjs') //commonjs
//import dayjs from 'dayjs' // ES 2015

如果需要使用到插件,那么还需引入插件并使用:

eg:

import relativeTime from "dayjs/plugin/relativeTime"; // import relativeTime plugin

dayjs.extend(relativeTime); //  use

dayjs输入默认是英文,如需可以加载其他语言:

eg: import "dayjs/locale/zh-cn"; // 中文

支持的语言:https://github.com/iamkun/dayjs/tree/dev/src/locale

使用:

<template>
   <div>{{aaa}}</div> //直接使用
   <div v-for="item in xxx">
       {{ dayjs(item).locale("zh-cn").fromNow() }} //无法直接使用
       {{ _dayjs(item).locale("zh-cn").fromNow() }} //可以将dayjs设为当前实例属性
   </div>
</template>

import dayjs from "dayjs";
import relativeTime from "dayjs/plugin/relativeTime";
import "dayjs/locale/zh-cn";
dayjs.extend(relativeTime);

export default {
  data() {
    return {
        _dayjs:''
    };
  },
  created() {
     this.aaa = dayjs("2020-8-01").locale("zh-cn").fromNow();
     this._dayjs = dayjs;
  }
};



挂载到全局:

main.js
import dayjs from "dayjs";
import relativeTime from "dayjs/plugin/relativeTime";
import "dayjs/locale/zh-cn";
dayjs.extend(relativeTime);
Vue.prototype.$dayJS = dayjs;
console.log(Vue.prototype.$dayJS);
获取或设置月份的日期:
dayjs().date()
dayjs().date(1)

获取或设置星期几:
dayjs().day()
dayjs().day(0)

获取或设置ISO星期:
dayjs.extend(isoWeek)
dayjs().isoWeekday()
dayjs().isoWeekday(1); // Monday

加上时间:返回一个克隆的Day.js对象,并添加指定的时间。
dayjs().add(7, 'day')  //day week month ...
同理减去时间:
dayjs().subtract(7, 'year') //...

指定时间以前:
dayjs.extend(relativeTime)
var a = dayjs()
var b = dayjs('1990-01-01')
a.from(b) // 2 years ago

...

 

  • 2
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值