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];
     }
   }
 }
相关推荐
重铸码农荣光8 小时前
从回调地狱到优雅异步:Promise 带你吃透 JS 异步编程核心
vue.js·promise
惜茶9 小时前
使用前端框架vue做一个小游戏
前端·vue.js·前端框架
普通码农9 小时前
Vue 3 接入谷歌登录 (小白版)
前端·vue.js
青浅l9 小时前
vue中回显word、Excel、txt、markdown文件
vue.js·word·excel
摇滚侠10 小时前
Vue 项目实战《尚医通》,完成预约通知业务,笔记21
前端·vue.js·笔记·前端框架
西洼工作室12 小时前
前端项目目录结构全解析
前端·vue.js
咫尺的梦想00712 小时前
vue的生命周期
前端·javascript·vue.js
JIngJaneIL14 小时前
数码商城系统|电子|基于SprinBoot+vue的商城推荐系统(源码+数据库+文档)
java·前端·数据库·vue.js·论文·毕设·数码商城系统
艾小码15 小时前
Vue组件通信不再难!这8种方式让你彻底搞懂父子兄弟传值
前端·javascript·vue.js
lcc18715 小时前
Vue 数据代理
前端·javascript·vue.js