Ant Design Vue中日期选择器快捷选择 presets 用法

RyzenVega

于 2024-07-22 11:04:21 发布

阅读量308

点赞数 2

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/weixin_46607967/article/details/140604293

版权

ant写文档的纯懒狗

返回的是一个day.js对象范围选择时可接受一个数组具体参考操作 · Day.js

话不多说直接上代码

 <a-range-picker
    v-model:value="formData.datePick"
    valueFormat="YYYY-MM-DD HH:mm:ss"
    showTime
    :presets="presets"
    @change="handleData"
/>




import dayjs from 'dayjs'

const presets = ref([
  {
    label: '今天',
    value: [dayjs().startOf('day'), dayjs().endOf('day')]
  },
  {
    label: '最近3天',
    value: [dayjs().add(-3, 'day'), dayjs()]
  },
  {
    label: '最近7天',
    value: [dayjs().add(-7, 'day'), dayjs()]
  },
  { label: '最近30天', value: [dayjs().add(-30, 'day'), dayjs()] }
])