el-date-picker时间范围搜索条件,watch监听

el-date-picker时间范围搜索条件 使用watch监听

HTML部分:
VUE 复制代码
<el-form-item label="日期选择" prop="orderNo">
        <el-date-picker
          v-model="dataList"
          type="daterange"
          value-format="yyyy-MM-dd"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期">
        </el-date-picker>
      </el-form-item>
JS部分:
JS' 复制代码
export default {
  data() {
    return {
      dataList:[],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        startDate: null,
        endDate:null,
      },
    }
  },
  watch: {
      // 监听 dataList 变化
      dataList(newVal) {
        this.queryParams.startDate = newVal[0];
        this.queryParams.endDate = newVal[1];
     }
   }
 }
相关推荐
前端摸鱼匠37 分钟前
Vue 3 的defineEmits编译器宏:详解<script setup>中defineEmits的使用
前端·javascript·vue.js·前端框架·ecmascript
英俊潇洒美少年1 小时前
Vue3 企业级封装:useEventListener + 终极版 BaseEcharts 组件
前端·javascript·vue.js
英俊潇洒美少年7 小时前
前端组件化开发最佳实践 + 高频面试题(Vue & React)
前端·vue.js·react.js
吴声子夜歌8 小时前
Vue3——计算属性和监听属性
前端·vue.js
阿民_armin8 小时前
使用 IntersectionObserver + 哨兵元素实现长列表懒加载
前端·javascript·vue.js
不想说话的麋鹿8 小时前
「性能优化」虚拟列表极致优化实战:从原理到源码,打造丝滑滚动体验
前端·vue.js·面试
一 乐9 小时前
工会管理|基于springboot + vue工会管理系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·论文·毕设·工会管理系统
XTTX1109 小时前
Vue3+Cesium电子围栏效果
前端·javascript·vue.js
Ruihong10 小时前
你的 Vue 3 defineProps(),VuReact 会编译成什么样的 React?
vue.js·react.js·面试
小高00710 小时前
🔥前端性能内卷终点?Signals 正在重塑我们的开发习惯
前端·javascript·vue.js