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 方法格式化成指定的格式。

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

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值