React Ant Design 通过 DatePicker获取一周的起止时间

项目中遇到了选择周获取当前周的周一和周日的日期

直接看用的组件Ant Design

这是写的代码

<Space direction="vertical">
    <DatePicker onChange={onChange} picker="week" />
</Space>

需要用到moment,

1.安装moment

npm install moment --save

2.页面引入moment

import moment from 'moment'

写入事件

//周日期选择
  const onChanges = (date, dateString) => {
    console.log(date, dateString);
    const startDate = moment(date).day(1).format('YYYY-MM-DD '); // 周一日期
    const endDate = moment(date).day(7).format('YYYY-MM-DD'); // 周日日期
    console.log(startDate, endDate);
  }

看看控制台输出的结果

 可以看到,已经正确获取到了当前日期所在周的起止日期了。

这里的日期解析主要用到了 moment.js 提供的两个方法,

moment(date).day(1) 代表指定日期所在周的星期一的日期,

moment(date).day(7) 代表指定日期所在周的星期日的日期,

并且通过 format 方法格式化成指定的格式。

文章仅限参考 如有错误请及时指出或补充


版权声明:本文为wsdshdhdhd原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。