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];
     }
   }
 }
相关推荐
汝生淮南吾在北1 小时前
SpringBoot+Vue饭店点餐管理系统
java·vue.js·spring boot·毕业设计·毕设
JIngJaneIL6 小时前
基于Java非遗传承文化管理系统(源码+数据库+文档)
java·开发语言·数据库·vue.js·spring boot
+VX:Fegn08956 小时前
计算机毕业设计|基于springboot + vue心理健康管理系统(源码+数据库+文档)
数据库·vue.js·spring boot·后端·课程设计
老华带你飞9 小时前
旅游|基于Java旅游信息系统(源码+数据库+文档)
java·开发语言·数据库·vue.js·spring boot·旅游
韭菜炒大葱10 小时前
别等了!用 Vue 3 让 AI 边想边说,字字蹦到你脸上
前端·vue.js·aigc
关关长语11 小时前
Vue本地部署包快速构建为Docker镜像
前端·vue.js·docker
一 乐11 小时前
高校评教|基于SpringBoot+vue高校学生评教系统 (源码+数据库+文档)
java·数据库·vue.js·spring boot·后端·学习
爱分享的鱼鱼11 小时前
Vue生命周期钩子详解与实战应用
前端·vue.js
sosojie12 小时前
and+design的table前端本地分页处理
前端·vue.js
apollo_qwe12 小时前
Vue3 核心设计模式实战:5 种模式 + 可复用代码,覆盖 80% 开发场景
vue.js