通过moment给两个指定日期之间添加数据

比如某个需求你前端要的是12/20至12/23的数据，并在页面中显示出来，但是后端没查到21号有数据，他可能返回的数据是这样的（缺少某一个,比如2019/12/21）

[{"today":"2019/12/20 00:00:00","num":1},

{"today":"2019/12/22 00:00:00","num":5},

{"today":"2019/12/23 00:00:00","num":3},]

然后这位老哥，又不想自己加或不会加，然后产品的要求呢又是你就算0也要显示出来！

引入

那我们就自己！通过momentJs插件，新建一个文件比如叫utils.js然后把这个代码贴进去

import moment from "moment";
const Utils = {
  getDiffDayNum: (startDate, endDate) => moment(new Date(endDate)).diff(moment(new Date(startDate)), 'days'),
  autoAddSpaceBetweenDate: (dataList, {
    KEY_NAME = 'time',
    VALUE_KEY_NAME = 'total',
    FORMAT = 'YYYY/MM/DD 00:00:00',
    START_DATE = null,
    END_DATE = null,
    ADD_KEY_VALUE = 0,
  } = {}) => {
    if (!dataList || !dataList.length) return []
    const dataListTimeArr = dataList.map(e => e[KEY_NAME])
    START_DATE = START_DATE || dataList[0][KEY_NAME]
    END_DATE = END_DATE || dataList[dataList.length - 1][KEY_NAME]
    const totalDay = Utils.getDiffDayNum(START_DATE, END_DATE) + 1
    const newDateArr = []
    let findNum = 0
    for (var i = 0; i < totalDay; i++) {
      const nextDateStr = moment(START_DATE).add(i, 'days').format(FORMAT)
      newDateArr[i] = dataListTimeArr.includes(nextDateStr) ? dataList[findNum++] : { [KEY_NAME]: nextDateStr, [VALUE_KEY_NAME]: ADD_KEY_VALUE }
    }
    return newDateArr
  }
}
export default Utils;

使用

在要用的地方引入utils.js文件并使用

const newList = Utils.autoAddSpaceBetweenDate(list, { // list要处理的数据，如上面的示例数组
    KEY_NAME: 'today', // 日期的字段，用来对比日期
    VALUE_KEY_NAME: 'num', // 为空也要显示的字段
    START_DATE: params.beginTime, // 开时
    END_DATE: params.endTime, // 结时
})

最后可得到

[{"today":"2019/12/20 00:00:00","num":1},

{"today":"2019/12/21 00:00:00","num":0}, // 新加的

{"today":"2019/12/22 00:00:00","num":5},

{"today":"2019/12/23 00:00:00","num":3},]

结束！

友情链接：安装MomentJs