基础学习: dayjs

一个在某些场景上代替 moment 的库
更新于: 2024-05-14 13:29:13

cheatsheet

功能代码
取当地时间
dayjs().format() 
// 默认返回的是 ISO8601 格式字符串 '2020-04-02T08:02:17-05:00'
clone
var a = dayjs()
var b = a.clone()
// a 和 b 是两个独立的 Day.js 对象
validate
dayjs('2022-01-33').isValid();
// true, parsed to 2022-02-02
dayjs('some invalid string').isValid();
// false
格式化
// 参考: https://dayjs.gitee.io/docs/zh-CN/display/format
dayjs().format('YYYY-MM-DD') 		// 2023-07-13
项目之 bootstrap.ts
import dayjs from 'dayjs';
import customFormats from '@jswork/dayjs-formats';

// load custom formats:
dayjs.extend(customFormats);

插件

编写一些好用的插件。

export default (option, dayjsClass, dayjsFactory) => {
  // extend dayjs()
  // e.g. add dayjs().isSameOrBefore()
  dayjsClass.prototype.isSameOrBefore = function(arguments) {}

  // extend dayjs
  // e.g. add dayjs.utc()
  dayjsFactory.utc = arguments => {}

  // overriding existing API
  // e.g. extend dayjs().format()
  const oldFormat = dayjsClass.prototype.format
  dayjsClass.prototype.format = function(arguments) {
    // original format result
    const result = oldFormat.bind(this)(arguments)
    // return modified result
  }
}

types

{ //tsconfig.json
  "compilerOptions": {
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
  }
}

带 typescript 的插件

一个实际的 dayjs 插件。

import { PluginFunc } from 'dayjs';

// https://github.com/iamkun/dayjs/issues/1605
// https://github.com/aric-notes/dayjs-notes/blob/main/src/plugins/my-plugin.js

const CUSTOM_FORMATS = {
  date: 'YYYY-MM-DD',
  time: 'hh:mm:ss',
  datetime: 'YYYY-MM-DD HH:mm:ss',
  month: 'YYYY-MM',
  dbdt: 'YYYYMMDD_hhmmss',
};

const customFormatsPlugin: PluginFunc = (option, dayjsClass, dayjsFactory) => {
  const oldFormat = dayjsClass.prototype.format;
  dayjsClass.prototype.format = function(formatStr, ...args) {
    const isCustomFormat = Boolean(formatStr && formatStr in CUSTOM_FORMATS);
    if (isCustomFormat) {
      return oldFormat.call(this, CUSTOM_FORMATS[formatStr!], ...args);
    }
    return oldFormat.call(this, formatStr, ...args);
  };
};

export default customFormatsPlugin;

参考