vue3 antdv3 a-range-picker a-date-picker 获取选择中的日期值

1、经常用到日期选择、日期范围选择控制

Ant Design Vue --- An enterprise-class UI components based on Ant Design and Vue.js

2、上代码:

复制代码
<RangePicker
        v-model:value="fieldvaluedate"
        style="width: 250px"
        :placeholder="['选择日期', '选择日期']"
        format="YYYY-MM-DD"
        @change="onRangePickerChange"
      />
      <DatePicker
        v-model:value="fieldvaluedate1"
        style="width: 250px"
        placeholder="选择日期"
        format="YYYY-MM-DD"
        @change="onDatePickerChange"
      />

  function onRangePickerChange(value, dateString) {
    fieldvalue = dateString[0] + ',' + dateString[1];
  }

  function onDatePickerChange(value, dateString) {
    fieldvalue = dateString;
  }

import { DatePicker, RangePicker } from 'ant-design-vue';

fieldvalue: '',
fieldvaluedate: ref<[Dayjs, Dayjs]>(),
fieldvaluedate1: ref<Dayjs>(),

 import dayjs, { Dayjs } from 'dayjs';
  import weekday from 'dayjs/plugin/weekday';
  import localeData from 'dayjs/plugin/localeData';
  dayjs.extend(weekday);
  dayjs.extend(localeData);

3、上面的代码,要适当的调整下,就可以使用了。

相关推荐
我的写法有点潮21 分钟前
竟然被element-plus背刺了
前端·javascript·vue.js
岁月宁静24 分钟前
AI 聊天消息长列表性能优化:后端分页 + 前端虚拟滚动
前端·vue.js·人工智能
Olrookie27 分钟前
若依前后端分离版学习笔记(十九)——导入,导出实现流程及图片,文件组件
前端·vue.js·笔记
墨客希37 分钟前
通俗易懂的理解Vue.js
vue.js·flutter
浩男孩40 分钟前
🍀终于向常量组件下手了,使用TypeScript 基于 TDesign二次封装常量组件 🚀🚀
前端·vue.js
江拥羡橙9 小时前
Vue和React怎么选?全面比对
前端·vue.js·react.js
暮之沧蓝11 小时前
Vue总结
前端·javascript·vue.js
excel11 小时前
深入解析 Vue 3 源码:computed 的底层实现原理
前端·javascript·vue.js
zero13_小葵司12 小时前
在Vue项目中构建后端配置的动态路由及权限控制体系
前端·javascript·vue.js
羊羊小栈14 小时前
基于「YOLO目标检测 + 多模态AI分析」的光伏板缺陷检测分析系统(vue+flask+模型训练+AI算法)
vue.js·人工智能·yolo·目标检测·flask·毕业设计·大作业