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、上面的代码,要适当的调整下,就可以使用了。

相关推荐
C_心欲无痕6 小时前
vue3 - 依赖注入(provide/inject)组件跨层级通信的优雅方案
前端·javascript·vue.js
BD_Marathon6 小时前
Vue3_响应式数据的处理方式
前端·javascript·vue.js
嚣张丶小麦兜7 小时前
Vue常用工具库
前端·javascript·vue.js
小飞侠在吗8 小时前
Vue customRef
前端·javascript·vue.js
雪碧聊技术8 小时前
登录页【电影画风视频背景】实现
vue.js·视频背景·video标签
指尖跳动的光8 小时前
判断页签是否为活跃状态
前端·javascript·vue.js
嚣张丶小麦兜9 小时前
认识vite
前端·javascript·vue.js
Awu122711 小时前
Vue3自定义渲染器:原理剖析与实践指南
前端·vue.js·three.js
进击的野人11 小时前
Vue.js 插槽机制深度解析:从基础使用到高级应用
前端·vue.js·前端框架
用户40993225021211 小时前
Vue3 v-if与v-show:销毁还是隐藏,如何抉择?
前端·vue.js·后端