React antd RangePicker组件获取所选中日期范围内的所有日期

React antd@TOC

React antd RangePicker组件获取所选中日期范围内的所有日期

需求：想要获取所选中日期范围内的所有日期

onChange

该组件的onChange方法是选中日期后的回调，如图会传入两个值一个开始时间一个结束时间

  const dateFormat = (dateItem) => {
  //依据自己的需要把日期转化为需要的格式
    return moment.unix(dateItem).format('YYYYMMDD');
  };
//获取全部日期的函数
  const getAllDate = (begin, end) => {
    const allDate = [];
    //把开始时间转化为时间戳
    const beginTime = moment(begin).unix();
    //把结束时间转化为时间戳
    const endTime = moment(end).unix();
    //步长：就是一天
    const step = 24 * 60 * 60;
    //while循环：每循环一次就加上一个步长（一天） 
    let k = beginTime;
    while (k <= endTime) {
      allDate.push(dateFormat(k));
      k += step;
    }
    return allDate;
  };

  const TimerPicker = (val) => {
  //因为消除日期传入进来的val为空值，所有要做一个判断
    if (val) {
      const allDate = getAllDate(val[0], val[1]);
      setDate(allDate);
    } else {
      setDate(val);
    }
  };