vue select联动 设置filterable坑

news2024/9/30 23:33:35

需求:
平台改变 获取服务类目List
服务类目改变 获取模板标题List
模板标题改变 获取关键词List
由于模板标题List数据条数较多,因此需要设置可搜索选择

问题:由于模板标题加了【filterable】属性。当服务类目改变时,模板标题要么显示无匹配数据,要么是上次选择的值。总之不会正常显示接口返回的数据。

解决思路:将上次选择的值重置,清空。
参考链接:https://blog.csdn.net/OldStreet61/article/details/88742445

解决代码如下:

<FormItem label="模板标题" prop="tid">
        <Select ref="dataSet" filterable v-model="popupForm.tid" placeholder="请选择模板标题" 
        @on-change="templateTitleChange" label-in-value>
          <Option v-for="item in templateTitleList" :value="item.tid" :key="item.tid">
          	{{ item.title }}
          </Option>
       </Select>
 </FormItem>
      
 // 服务类目改变
 serviceCategoryChange(data){
 	......
    // 将模板标题上次选择的值 重置 清空
   this.$refs.dataSet.setQuery(null)
   // 获取模板标题List
   this.getTemplateTitleList()
},

在这里插入图片描述

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

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

相关文章

肖sir__mysql之索引__010

mysql之索引 一、什么是索引&#xff1f; 索引是一种数据结构设计 一个索引是存储的表中数据结构&#xff1b; 索引是建立在表字段上&#xff0c; 索引包含了一列值&#xff0c;这个值保存在一个数据结构中 二、索引作用 1、保证数据记录的唯一性 2、实现表与表之间的参照性 3…

openGauss学习笔记-72 openGauss 数据库管理-创建和管理分区表

文章目录 openGauss学习笔记-72 openGauss 数据库管理-创建和管理分区表72.1 背景信息72.2 操作步骤72.2.1 使用默认表空间72.2.1.1 创建分区表&#xff08;假设用户已创建tpcds schema&#xff09;72.2.1.2 插入数据72.2.1.3 修改分区表行迁移属性72.2.1.4 删除分区72.2.1.5 增…

java学习--day6(数组)

文章目录 day5作业今天的内容1.数组1.1开发中为啥要有数组1.2在Java中如何定义数组1.3对第二种声明方式进行赋值1.4对数组进行取值1.5二维数组【了解】1.6数组可以当成一个方法的参数【重点】1.7数组可以当成一个方法的返回值1.8数组在内存中如何分配的【了解】 2.数组方法循环…

一文轻松实现在VSCode中编写Go代码

1.下载并安装VSCode VSCode&#xff08;Visual Studio Code&#xff09;是一款免费且功能强大的开源代码编辑器。VSCode适用于Windows、macOS和Linux操作系统&#xff0c;提供了丰富的编辑功能&#xff0c;包括语法高亮、智能代码补全、代码导航、重构支持、代码片段、多光标编…

windows常见的命令行操作

1.查看网络 ipconfig 2.根据任务id关闭进程 1.模糊搜索服务 tasklist | findstr QQ 2.根据模糊搜索结果&#xff0c;获取对应的pid taskkill /F /PID 5128 其他常见命令 若不清楚参数&#xff0c;使用&#xff08;命令 /?&#xff09;即可查看help

APP不存在,AK有误请检查再重试。详情查看: http://lbsyun.baidu.com/apiconsole/key

近期网站报百度地图无法使用情况&#xff0c;请参考百度提示的详情操作。 提示1&#xff1a; 提示2&#xff1a; 创建并复制AK教程&#xff1a;获取百度地图AK-易优CMS

看我72变!教你最火的 AI 变身换脸

今天要向大家推荐一个超级实用的AI换脸 APP——好说AI &#xff01;这款工具让你告别繁琐的修图流程&#xff0c;轻松几步就能生成完美照片。更重要的是&#xff0c;无需电脑&#xff0c;只要手机就能搞定&#xff01; 从前&#xff0c;我们看着综艺和电视剧&#xff0c;幻想着…

【好书推荐】《用户画像:平台构建与业务实践》

文章目录 1. 内容简介2. 书籍目录3. 图文介绍4. 送书活动 在大数据时代&#xff0c;如何有效地挖掘数据价值并通过画像数据进行呈现&#xff0c;如何基于画像数据构建平台功能并提高业务产出&#xff0c;是值得各类公司和业务人员思考并付诸实践的事情。通过画像释放大数据价值…

项目运行报错:error:0308010C:digital envelope routines::unsupported

node版本升到18之后&#xff0c;运行老项目报错 运行命令&#xff1a;npm run dev 解决办法&#xff1a; 第一步&#xff1a;在运行命令中补充set NODE_OPTIONS–openssl-legacy-provider & 第二步&#xff1a;如果依然报错&#xff0c;在终端中运行set NODE_OPTIONS–ope…

电视盒子什么品牌好?数码小编盘点网络电视盒子排行榜

电视盒子什么品牌好&#xff1f;每个品牌的优势并不一样&#xff0c;我们要根据自己的需求选择&#xff0c;看视频选无广告的&#xff0c;投屏频繁选投屏功能完善的&#xff0c;不懂的新手们可以参考小编分享的网络电视盒子排行榜&#xff0c;堪称目前最专业权威的电视盒子排名…

逻辑漏洞挖掘之XSS漏洞原理分析及实战演练 | 京东物流技术团队

一、前言 2月份的1.2亿条用户地址信息泄露再次给各大公司敲响了警钟&#xff0c;数据安全的重要性愈加凸显&#xff0c;这也更加坚定了我们推行安全测试常态化的决心。随着测试组安全测试常态化的推进&#xff0c;有更多的同事对逻辑漏洞产生了兴趣&#xff0c;本系列文章旨在…

2023年Gartner新技术与AI成熟度曲线

1. Gartner 将生成式 AI 置于 2023 年新技术成熟度曲线的顶峰&#xff0c;新兴人工智能将对商业和社会产生深远影响 根据 Gartner, Inc. 2023 年新兴技术成熟度曲线&#xff0c;生成式人工智能 (AI) 处于成熟度曲线期望的顶峰&#xff0c;预计将在两到五年内实现转型效益。生成…

Vue.js基础语法下

&#x1f3ac; 艳艳耶✌️&#xff1a;个人主页 &#x1f525; 个人专栏 &#xff1a;《Spring与Mybatis集成整合》《springMvc使用》 ⛺️ 生活的理想&#xff0c;为了不断更新自己 ! 1、事件处理器 1.1. 概述 在Vue中&#xff0c;事件处理器是用来处理DOM事件的方法。它可…

230920_整合微信支付宝支付

整合微信支付宝支付 一. 微信支付1. 支付中心_订单表Orders结构2. 微信支付时序图2.1 参考文档2.2 二维码支付时序图 一. 微信支付 1. 支付中心_订单表Orders结构 2. 微信支付时序图 2.1 参考文档 微信支付开发文档首页微信_native二维码支付文档微信支付文档 2.2 二维码支…

全链路自动化测试

背景 从 SOA 架构到现在大行其道的微服务架构&#xff0c;系统越拆越小&#xff0c;整体架构的复杂度也是直线上升&#xff0c;我们一直老生常谈的微服务架构下的技术难点及解决方案也日渐成熟&#xff08;包括典型的数据一致性&#xff0c;系统调用带来的一致性问题&#xff…

【Linux】【网络】应用层协议:HTTPS

文章目录 HTTPS1. 加密方式2. 数据摘要 \ 数据指纹3. 数字签名 HTTPS 的 工作过程HTTPS 工作过程中的密钥 HTTP HTTPS HTTP&#xff08;HyperText Transfer Protocol&#xff09;&#xff1a; 是客户端浏览器或其他程序与 Web 服务器之间的应用层通信协议。 HTTPS&#xff0…

创建一个普通的vue项目

1.用HbuilderX工具开发&#xff0c;新建项目时选择vue2.6.10 2.点击新建终端&#xff0c;输入npm run serve命令 3.vue项目配置elementui 可以按照官方方法使用npm i element-ui -S命令进行安装 在main.js配置3行&#xff0c;且要在最前面 1.import ElementUI from ‘elemen…

什么是VLAN?VLAN是如何工作的?

【微|信|公|众|号&#xff1a;厦门微思网络】 VLAN&#xff08;Virtual Local Area Network&#xff09;即虚拟局域网&#xff0c;是将一个物理的LAN在逻辑上划分成多个广播域的通信技术。 每个VLAN是一个广播域&#xff0c;VLAN内的主机间可以直接通信&#xff0c;而VLAN间则…

解锁搜索新境界!让文本语义匹配助你轻松找到你需要的一切!(快速上手baseline)

解锁搜索新境界&#xff01;让文本语义匹配助你轻松找到你需要的一切&#xff01;(快速上手baseline) 实现了多种相似度计算、匹配搜索算法&#xff0c;支持文本、图像&#xff0c;python3开发&#xff0c;pip安装&#xff0c;开箱即用。 文本相似度计算&#xff08;文本匹配&…

【图像去噪】【TGV 正则器的快速计算方法】通过FFT的总(广义)变化进行图像去噪(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…