vue2 封装通用表格数据筛选的重置摁钮

news2024/11/28 2:52:18

在这里插入图片描述

放弃冗余代码吧,封装个混入

封装逻辑

// 重置表格筛选参数
export const queryReset = {
  methods: {
    queryReset(form, method = "getData", fn) {
      if (!this[form]) {
        form = "queryForm";
      }

      this.$data[form] = this.$options.data()[form];

      this[form]["pageNum"] = 1;
      this[form]["pageSize"] = this.$tableDataSize;
      
      this[method]();
      if (fn && typeof fn === "function") {
        fn()
      }
    },
  }
}

在页面处引入

在这里插入图片描述

就图中3步,无需再定义【重置】摁扭的事件

说明

queryReset() 有三个参数:form, method, fn

  • form是你重置的参数大对象 [默认叫queryForm]
  • 重置完参数调用接口查询列表数据的方法 [默认叫getData()]
  • 还要执行的方法(备用)

我有一个习惯,就是每个页面的表格查询方法都叫getData(),所以这个默认getData()了。每个页面表格的查询条件都放在queryForm大对象里了,所以这个默认queryForm。每个表格的查询都有分页的参数pageNum、pageSize

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/976135.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

2023开学礼《乡村振兴战略下传统村落文化旅游设计》许少辉八一新书对外经济贸易大学图书馆

2023开学礼《乡村振兴战略下传统村落文化旅游设计》许少辉八一新书对外经济贸易大学图书馆

2023最新UI工作室官网个人主页源码/背景音乐/随机壁纸/一言

2023最新UI工作室官网个人主页源码/支持背景音乐/随机壁纸/一言 功能介绍: 载入动画 站点简介 Hitokoto 一言 日期及时间 实时天气 时光进度条 音乐播放器 移动端适配 打开文件;index.html和setting.json修改替换你的相关信息&a…

Windows下安装配置Nginx

nginx安装 官网下载地址 https://nginx.org/en/download.html 推荐使用稳定版本 截止时间2023年9月5日稳定版本为 1.24.0 百度网盘 链接:https://pan.baidu.com/s/1cXm-jN2fMzKdVMRhbG72Fg 提取码:9hcq 下载完成以后,得到nginx压缩包; 双击启动nginx.…

2023年模拟IC就业形式怎么样? 还能不能入了?(附最新薪资行情)

虽然说模拟IC的门槛高,难度大,但相比数字IC的话竞争要小一点。而且薪资也比数字IC要高一些。 想要学好模拟芯片设计,首先要懂电路,懂器件,你要理解你的器件是怎么工作的,它在芯片上是什么样子,…

如何使用代理配置快速定位接口测试脚本问题?

在调试接口用例过程中,如果响应结果和预期结果不一致,则需要检查请求信息。通过代理获取自动化测试中的请求响应信息,对比与正常请求响应的区别,就能够更直观的排查请求错误,相当于编写代码时的 debug 功能。 实战练习…

华为数通安全产品介绍

HiSecEngine USG12000系列防火墙(以下简称USG12000系列)是华为公司推出的首款T级AI防火墙,在网络边界实时防护已知与未知威胁,通常部署在云计算数据中心,大型企业及园区网出口,为数据中心、企业及园区网络提…

[MySQL]查看数据库大小

查看库大小 例如:查看当前MySQL中数据总量超过2GB的库: select table_schema as 数据库,table_rows as 记录数,data_size as 数据容量(GB),index_size as 索引容量(MB) from (selecttable_schema,sum(table_rows) as table_rows,sum(truncate(data_leng…

1794086 -F110 清算日期与付款时的付款日期不同

确实没有想到设置的地方在这里。 症状 用户在事务 F110 中执行付款,且清算日期字段 (BSEG-AUGDT) 未设置为付款日期。 重现问题 执行事务 F110 并执行自动付款。完成后,检查凭证中的“清算日期”字段。该日期与付款日期不同。 例如,您具…

jQuery 层次选择器

jQuery 层次选择器 (0)测试前的准备工作 A. 定义测试对象 B. 定义测试对象的 CSS 样式 C. 再定义一些测试用的 button。 (1)所有后代选择器(A B) 所有后代,包括其直接后代及间接后代。 (2)直…

统计学极简入门-统计学简介

1.统计学简介 听说你已经被统计学劝退,被Python唬住……先别着急划走,看完这篇再说! 先说结论,大多数情况下的学不会都不是知识本身难,而是被知识的传播者劝退的。 比如大佬们授课,虽逻辑严谨、思维缜密…

并行计算之OpenMP简介

OpenMP环境安装 基于ubuntu20.04 sudo apt-get update sudo apt-get install libomp-devOpenMP概述 面向多线程并行编码的编译指导语句,如 #pragma omp parallel#pragma omp for#pragma omp sections包含相应的函数接口库和runtime(运行时系统) omp_get_thread_n…

21.SPI万能驱动

spi万能驱动:spidev.c文件 存放在内核/drivers/spi/spidev.c文件。 内核开放的通用版本的spi驱动。 内核集成spidev驱动模块,开机后会中的加载此模块。 支持修改多种spi通信参数。 两个数据类型 spidev_data结构体 fops中的函数结构都要用到&#xff…

C/C++ CMake编译工具轻度使用

目录 CMake编译工具 一、CMake概述 二、CMake的使用 2.1 注释 2.1.1 注释行 2.1.2 注释块 2.2 源文件 2.1.1 共处一室 2.1.2 VIP包房 2.3 私人定制 2.2.1 定义变量 2.2.2 指定使用的C标准 2.2.3 指定输出的路径 2.4 搜索文件 2.3.1 方式1 2.3.2 方式2 2.5 包含…

WebGL射击游戏的优化

myshmup.com 允许在浏览器中创建 shmup(射击)游戏,我们可以使用具有创意通用许可证的资源或上传自己的艺术作品和声音。 创建的游戏可以在网站上发布。 该平台不需要编码,游戏对象的配置是在用户界面的帮助下执行的,后端是使用Django框架开发的,编辑器 UI 用 Javascript …

Spring项目配置

1.创建项目 2.修改编码格式为UTF-8 3.检查或配置代码⾃动补全功能 4.检查或配置⾃动导包 5.检查或配置Maven,可以⽤国内仓库镜像 6.idea识别Maven项⽬:在Notifications视图中会提⽰Load Maven Project,点击即可。 7.开启热部署 a.确认 pom.x…

vue制作页面水印

1.新建一个js js的代码 let watermark {}let setWatermark (str) > {let id 1.23452384164.123412415if (document.getElementById(id) ! null) {document.body.removeChild(document.getElementById(id))}let can document.createElement(canvas)can.width 500can.he…

一文彻底吃透自动化测试框架所有知识

定义测试自动化 在任何行业中,自动化通常被解释为自动处理流程,而这些流程几乎不需要人工干预。在软件行业,测试自动化意味着使用许可版本或开源的自动化工具对软件应用程序执行各种测试。用技术术语来说,测试自动化框架是一组定制…

css自学框架之图片灯箱展示

实现的功能是页面中的图片单击,在灯箱中显示,单击按钮上下切换,单击灯箱退出展示,效果如下GIF展示。 实现步骤还是老样子,三方面工作一是CSS、二是JavaSxcript,三是HTML,下面开始一步一步实现&…

助眠小程序源码系统搭建

一直比较热门的项目,这款系统支持流量主和会员体系的。 用抖音伴侣直播也不错,然后间接引流到自己的小程序,后期还可以卖项目等, 也适合拿来做流量矩阵小程序。也可以用来做其他的声音音乐类的项目 大致功能: 支持流量主支持会员…

运维Shell脚本小试牛刀(五):until循环|循环控制break|continue

运维Shell脚本小试牛刀(一) 运维Shell脚本小试牛刀(二) 运维Shell脚本小试牛刀(三)::$(cd $(dirname $0); pwd)命令详解 运维Shell脚本小试牛刀(四): 多层嵌套if...elif...elif....else fi_蜗牛杨哥的博客-CSDN博客 Cenos7安装小火车程序动画 运维Shell脚本小试…