a-select:远程搜索——防抖节流处理——基础积累

a-select:远程搜索——防抖节流处理——基础积累

  • 效果图
  • 下拉筛选数据:
  • 远程搜索功能:

效果图

在这里插入图片描述

下拉筛选数据:

 <a-selectshow-searchv-model="form.jobPositionCode"placeholder="请选择岗位"style="width: 100%"@change="jobChange":filter-option="filterOption"
><a-select-optionv-for="li in jobPositionList":key="li.code":value="li.code">{{ li.displayText }}</a-select-option>
</a-select>
filterOption(input, option) {return (option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0);
},

远程搜索功能:

<a-selectshow-searchv-model="form.executorId"placeholder="请选择人员"style="width: 100%":filter-option="false"@search="getUser"@change="userChange"
><a-select-optionv-for="li in userList":key="li.id":value="li.id">{{ li.userName }}</a-select-option>
</a-select>
debounce(callback, delay = 200) {clearTimeout(this.timeout);this.timeout = setTimeout(() => {callback();}, delay);
},
userChange(val) {this.form.executorName = null;let obj = this.userList.find((item) => item.id == val);if (obj && obj.id) {this.form.executorName = obj.userName;this.$forceUpdate();}},getUser(val) {this.debounce(() => {let params = {Filter: val,current: 1,pageSize: 50,};this.fetchUser(params);});},fetchUser(params) {getList(params).then((data) => {if (data.success) {this.userList = data.result.items || [];}});},

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

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

相关文章

Redis哈希对象(listpack介绍)

哈希对象的编码可以是ziplist或者hashtable。再redis5.0版本之后出现listpack&#xff0c;为了是代替ziplist。 一. 使用ziplist编码 ziplist编码的哈希对象使用压缩列表作为底层实现&#xff0c;每当有新的键值对要加入到哈希对象时&#xff0c;程序都会先将保存了键值对的键…

【Linux 静态IP配置】

静态IP配置 1.NAT模式设置2.设置静态ip3.重启网络4.查看ip 1.NAT模式设置 首先设置虚拟机中NAT模式的选项&#xff0c;打开VMware&#xff0c;点击“编辑”下的“虚拟网络编辑器”&#xff0c;设置NAT参数 注意&#xff1a; VMware Network Adapter VMnet8保证是启用状态 …

ClassCMS2.4漏洞复现

ClassCMS2.4漏洞复现 环境搭建 任意文件下载漏洞复现 漏洞成因 ClassCMS2.4漏洞复现 CMS源码在附件中 环境搭建 使用phpstudy2016搭建web环境&#xff0c;php版本为5.5 安装CMS 这里选择Mysql数据库进行安装 用户名和密码都写默认的admin方便记忆 输入完成后点击安装 点…

【性能测试】性能测试监控关键指标

系统指标 检测性能测试是否有bug的关键指标 1、系统指标——与用户场景及需求直接相关。 并发用户数&#xff1a;某一物理时刻同时向系统提交请求的用户数。平均响应时间&#xff1a;系统处理事务的响应时间的平均值&#xff0c;对于系统快速响应类页面&#xff0c;一般响应…

货代FOB条款卖方必备的知识:发货人都要承担哪些费用呢?

据统计&#xff0c;中国出口中以FOB成交的占到70%&#xff0c;但专家指出&#xff1a;FOB对出口商的风险更大&#xff0c;有可能造成货、款两空的结局。 目前我国出口合同以FOB价格条款成交的比例越来越大&#xff0c;而且收货人指定船公司的少&#xff0c;指定境外货代的多&am…

建设银行新余市分行积极开展国债下乡宣传活动

近日&#xff0c;为了普及国债知识&#xff0c;提高农村居民对国债的认知度和投资意识&#xff0c;建设银行新余市分行组织员工前往下村开展了一场国债下乡宣传活动。 活动当天&#xff0c;工作人员早早地来到了下乡地点&#xff0c;悬挂起了国债宣传横幅&#xff0c;并摆放了…

ESP32-Web-Server编程- 使用SSE 实时更新设备信息

ESP32-Web-Server编程- 使用SSE 实时更新设备信息 概述 如前所述&#xff0c;传统 HTTP 通信协议基于 Request-Apply&#xff08;请求-响应&#xff09;机制&#xff0c;浏览器&#xff08;客户端&#xff09;只能单向地向服务器发起请求&#xff0c;服务器无法主动向浏览器推…

java源码-数组

背景 上传图片&#xff0c;需要对图片格式进行校验&#xff0c;这是就可以使用数组 1、什么是数组&#xff1f; Java 语言中提供的数组是用来存储固定大小的同类型元素。 如&#xff1a;可以声明一个数组变量&#xff0c;如 numbers[100] 来代替直接声明 100 个独立变量 numb…

替代升级虚拟化 | ZStack Cloud云平台助力中节能镇江公司核心业务上云

数字经济正加速推动各行各业的高质量升级发展&#xff0c;云计算是数字经济的核心底层基础设施。作为云基础软件企业&#xff0c;云轴科技ZStack 坚持自主创新&#xff0c;自研架构&#xff0c;产品矩阵可全面覆盖数据中心云基础设施&#xff0c;针对虚拟化资源实现纳管、替代和…

用按层次顺序遍历二叉树的方法,设计算法统计树中度为1的结点数目

用按层次顺序遍历二叉树的方法&#xff0c;设计算法统计树中度为1的结点数目 代码思路&#xff1a; 层序遍历的实现需要借助一个辅助队列 首先将根结点入队&#xff0c;然后根出队&#xff0c;把根的两个子树入队 然后下面循环执行&#xff1a;队头元素出队&#xff0c;队头元…

如何通过降低设备六大损失帮助企业改善OEE

在各个行业中&#xff0c;改善设备综合效率OEE&#xff08;Overall Equipment Efficiency&#xff09;是企业实现高效生产和竞争优势的关键。然而&#xff0c;设备的六大损失常常影响着企业的OEE指标。本文将探讨如何通过降低这六大损失来帮助企业改善OEE&#xff0c;提高生产效…

2023年掌控安全学院CTF暖冬杯——数据流分析

前言&#xff1a;打工仔一枚&#xff0c;第一波上新的3题misc 做完了 再打ISCTF随便记录一下 PS&#xff1a;环境关了&#xff0c;题目描述忘记了&#xff0c;反正就是找flag。 筛选HTTP数据流 导出数据流慢慢看 ctrl F 搜flag 看到一条 有flag.txt 的数据 导出另存.zip 这里…

洗袜子的洗衣机哪款好?内衣洗衣机便宜好用的牌子

不得不说洗衣机的发明解放了我们的双手&#xff0c;而我们从小到大就有这个意识&#xff0c;贴身衣物不可以和普通的衣服一起丢进去洗衣机一起&#xff0c;而内衣裤上不仅有肉眼看见的污渍还有手上根本无法消灭的细菌&#xff0c;但是有一款专门可以将衣物上的细菌杀除的内衣洗…

java设计模式学习之【建造者模式】

文章目录 引言建造者模式简介定义与用途实现方式&#xff1a; 使用场景优势与劣势建造者模式在spring中的应用CD&#xff08;光盘&#xff09;的模拟示例UML 订单系统的模拟示例UML 代码地址 引言 建造者模式在创建复杂对象时展现出其强大的能力&#xff0c;特别是当这些对象需…

docker集群的详解以及超详细搭建

文章目录 一、问题引入1. 多容器位于同一主机2. 多容器位于不同主机 二、介绍三、特性四、概念1. 节点nodes2. 服务(service)和任务(task)3. 负载均衡 五、docker网络1. overlay网络 六、docker集群搭建1. 环境介绍2. 创建集群3. 集群网络4. 加入工作节点 七、部署可视化界面po…

数学建模-基于脑出血患者院前指标的多种机器学习预测模型构建及比较研究

基基于脑出血患者院前指标的多种机器学习预测模型构建及比较研究 整体求解过程概述(摘要) 卒中是全球致残率、致死率最高的疾病之一&#xff0c;其中脑出血&#xff08;Intracerebral hemorrhage&#xff0c;ICH&#xff09;患者仅占卒中患者的 20%&#xff0c;但致残、死亡人…

【Linux】ln命令使用

ln命令 ln是linux中又一个非常重要命令&#xff0c;请大家一定要熟悉。它的功能是为某一个文件在另外一个位置建立一个同步的链接&#xff0c;这个命令最常用的参数是-s&#xff0c;具体用法是&#xff1a;ln –s 源文件 目标文件。 当我们需要在不同的目录&#xff0c;用到相…

CMIP6数据处理及在气候变化、水文、生态等领域中应用

气候变化对农业、生态系统、社会经济以及人类的生存与发展具有深远影响&#xff0c;是当前全球关注的核心议题之一。IPCC&#xff08;Intergovernmental Panel on Climate Change&#xff0c;政府间气候变化专门委员会&#xff09;的第六次评估报告明确&#xff1b;指出&#x…

西班牙Wallapop是什么?原来欧洲版闲鱼也很好用!

说到国内的闲鱼大家肯定不陌生&#xff0c;那国外的二手闲置平台大家知道吗&#xff1f;在西班牙&#xff0c;最受欢迎的移动购物APP是Wallapop和速卖通。Wallapop是西班牙第一大二手商品网站&#xff0c;网站上丰富的性价比高的商品正好满足了西班牙人的需求。今天龙哥就和大家…

Yolov8实现瓶盖正反面检测

一、模型介绍 模型基于 yolov8n数据集采用SKU-110k&#xff0c;这数据集太大了十几个 G&#xff0c;所以只训练了 10 轮左右就拿来微调了 基于原木数据微调&#xff1a;训练 200 轮的效果 10 轮SKU-110k 20 轮原木 200 轮瓶盖正反面 微调模型下载地址https://wwxd.lanzouu.co…