Cascader 级联选择器一级单选二级多选

  <el-form-itemlabel="开关配置":rules="[{ required: false, message: '开关配置', trigger: 'blur' }]"><el-cascaderstyle="width: 300px"clearablecollapse-tagsfilterable:props="{multiple: true}"v-model="cascaderValue"@change="cascaderHandleChange":options="dsConfigOption"ref="cascader"><template slot-scope="{ node, data }"><span v-if="node.level !== 4">{{ node.label }}</span><el-inputv-elsev-model="node.value"@input="handleInputChange(node, $event)"placeholder="请输入值"></el-input></template></el-cascader></el-form-item>

dsConfigOption :

[{"value":1,"label":"enable_Replay_MachineLearningAI_TDM","children":[{"value":21,"label":"客户端与DS","children":[{"value":30,"label":"模式变量","children":[{"value":0,"label":"值"}]},{"value":31,"label":"控制台变量","children":[{"value":0,"label":"值"}]},{"value":32,"label":"更快下发到客户端的控制台变量","children":[{"value":0,"label":"值"}]},{"value":33,"label":"安全策略阈值","children":[{"value":0,"label":"值"}]}]},{"value":22,"label":"仅DS","children":[{"value":30,"label":"模式变量","children":[{"value":0,"label":"值"}]},{"value":31,"label":"控制台变量","children":[{"value":0,"label":"值"}]},{"value":32,"label":"更快下发到客户端的控制台变量","children":[{"value":0,"label":"值"}]},{"value":33,"label":"安全策略阈值","children":[{"value":0,"label":"值"}]}]},{"value":23,"label":"仅客户端","children":[{"value":30,"label":"模式变量","children":[{"value":0,"label":"值"}]},{"value":31,"label":"控制台变量","children":[{"value":0,"label":"值"}]},{"value":32,"label":"更快下发到客户端的控制台变量","children":[{"value":0,"label":"值"}]},{"value":33,"label":"安全策略阈值","children":[{"value":0,"label":"值"}]}]},{"value":24,"label":"安全控制阀","children":[{"value":30,"label":"模式变量","children":[{"value":0,"label":"值"}]},{"value":31,"label":"控制台变量","children":[{"value":0,"label":"值"}]},{"value":32,"label":"更快下发到客户端的控制台变量","children":[{"value":0,"label":"值"}]},{"value":33,"label":"安全策略阈值","children":[{"value":0,"label":"值"}]}]}]},{"value":2,"label":"test","children":[{"value":21,"label":"客户端与DS","children":[{"value":30,"label":"模式变量","children":[{"value":0,"label":"值"}]},{"value":31,"label":"控制台变量","children":[{"value":0,"label":"值"}]},{"value":32,"label":"更快下发到客户端的控制台变量","children":[{"value":0,"label":"值"}]},{"value":33,"label":"安全策略阈值","children":[{"value":0,"label":"值"}]}]},{"value":22,"label":"仅DS","children":[{"value":30,"label":"模式变量","children":[{"value":0,"label":"值"}]},{"value":31,"label":"控制台变量","children":[{"value":0,"label":"值"}]},{"value":32,"label":"更快下发到客户端的控制台变量","children":[{"value":0,"label":"值"}]},{"value":33,"label":"安全策略阈值","children":[{"value":0,"label":"值"}]}]},{"value":23,"label":"仅客户端","children":[{"value":30,"label":"模式变量","children":[{"value":0,"label":"值"}]},{"value":31,"label":"控制台变量","children":[{"value":0,"label":"值"}]},{"value":32,"label":"更快下发到客户端的控制台变量","children":[{"value":0,"label":"值"}]},{"value":33,"label":"安全策略阈值","children":[{"value":0,"label":"值"}]}]},{"value":24,"label":"安全控制阀","children":[{"value":30,"label":"模式变量","children":[{"value":0,"label":"值"}]},{"value":31,"label":"控制台变量","children":[{"value":0,"label":"值"}]},{"value":32,"label":"更快下发到客户端的控制台变量","children":[{"value":0,"label":"值"}]},{"value":33,"label":"安全策略阈值","children":[{"value":0,"label":"值"}]}]}]}]

cascaderHandleChange

        cascaderHandleChange(e) {if (!e.length) return;const tempId = this.dsIds.tempId === 0 ? e[0][0] : this.dsIds.tempId;const sameArr = e.filter(item => item[0] === tempId);const unSameArr = e.filter(item => item[0] !== tempId);if (unSameArr.length) {this.dsIds.tempId = unSameArr[0][0];this.cascaderValue = unSameArr;} else {this.cascaderValue = sameArr;}},

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

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

相关文章

Python vs PHP:哪种语言更适合网页抓取

本文将比较 Python 和 PHP&#xff0c;以帮助读者确定哪种语言更适合他们的需求。文章将探讨两种语言的优点和缺点&#xff0c;并根据读者的经验水平分析哪种语言可能更容易上手。接下来&#xff0c;文章将深入探讨哪种语言在抓取网页数据方面更胜一筹。 简而言之&#xff0c;…

五分钟学会如何在GitHub上自动化部署个人博客(hugo框架 + stack主题)

上一篇文章&#xff1a; 10分钟学会免费搭建个人博客&#xff08;Hugo框架 stack主题&#xff09; 前言 首先&#xff0c;想要实现这个功能的小伙伴需要完成几个前置条件&#xff1a; 有一个GitHub账号安装了git&#xff0c;并可以通过git推送commit到GitHub上完成第一篇文章…

开发过程中的AI插件推荐

在ChatGPT日渐火爆的当下&#xff0c;开发工具中的各种AI插件也日渐成熟&#xff0c;在开发过程中能给予我们很大的助力&#xff0c;并大幅节省研发时间和成本&#xff0c;所以学会学会使用AI目前已算是必不可少的技能了。 一. CodeGeex(智谱清言) CodeGeeX是智谱AI旗下一款基…

鸿蒙之路的坑

1、系统 Windows 10 家庭版不可用模拟器 对应的解决方案【坑】 升级系统版本 直接更改密钥可自动升级系统 密钥找对应系统的&#xff08;例&#xff1a;windows 10专业版&#xff09; 升级完之后要激活 坑1、升级完后事先创建好的模拟器还是无法启动 解决&#xff1a;删除模拟…

企业销售人员培训系统|Java|SSM|VUE| 前后端分离

【技术栈】 1⃣️&#xff1a;架构: B/S、MVC 2⃣️&#xff1a;系统环境&#xff1a;Windowsh/Mac 3⃣️&#xff1a;开发环境&#xff1a;IDEA、JDK1.8、Maven、Mysql5.7 4⃣️&#xff1a;技术栈&#xff1a;Java、Mysql、SSM、Mybatis-Plus、VUE、jquery,html 5⃣️数据库可…

C 实现植物大战僵尸(一)

C 实现植物大战僵尸&#xff08;一&#xff09; 对应资源链接&#xff0c;C语言项目&#xff1a;完整版植物大战僵尸 以下内容为个人实现版&#xff0c;与原 UP 主项目代码内容有出入&#xff0c;提高了些可读和简洁性 一 创建主场景 安装 easyx 库&#xff0c;easyx 官网 …

SQL创建和操纵表

本文介绍创建、更改和删除表的基本知识。 1. 创建表 SQL 不仅用于表数据操纵&#xff0c;而且还用来执行数据库和表的所有操作&#xff0c;包括表本身的创建和处理。一般有两种创建表的方法&#xff1a; 多数DBMS 都具有交互式创建和管理数据库表的工具&#xff1b;表也可以…

Java开发经验——数据库开发经验

摘要 本文主要介绍了Java开发中的数据库操作规范&#xff0c;包括数据库建表规范、索引规约、SQL规范和ORM规约。强调了在数据库设计和操作中应遵循的最佳实践&#xff0c;如字段命名、数据类型选择、索引创建、SQL语句编写和ORM映射&#xff0c;旨在提高数据库操作的性能和安…

NTLM 中继到 LDAP 结合 CVE-2019-1040 接管全域

目录 LDAP中继 LDAP签名 CVE-2019-1040 NTLM MIC 绕过漏洞 漏洞背景 漏洞利用链 利用方式 1&#xff1a;配置基于资源的约束委派-攻击域控 利用方式 2&#xff1a;攻击 Exchange Exchange windows permissions 组介绍 复现 LDAP中继 LDAP&#xff08;轻量级目录访问协…

如何通过采购管理系统实现智能化采购?

随着人工智能、大数据等技术的快速发展&#xff0c;采购管理逐步迈入智能化时代。智能化采购不仅提升了效率&#xff0c;还为企业提供了更精准的采购决策支持。本文将从智能化采购的优势出发&#xff0c;探讨采购管理系统如何助力企业实现这一目标。 文中用到的采购管理系统&a…

STM32学习(一)

STM32是什么 STM32是意法半导体&#xff08;ST&#xff09;公司基于ARM Cortex-M内核开发的32位微控制器‌。他的名字是由&#xff1b;意大利SGS&法国Thomson共同研制的&#xff0c;中国人民取两家公司名称的首字母于是ST就是这样来的&#xff0c;M是单片机M-Micro Contro…

C# 读取多种CAN报文文件转换成统一格式数据,工具类:CanMsgRead

因为经常有读取CAN报文trace文件的需求&#xff0c;而且因为CAN卡不同、记录软件不同会导致CAN报文trace文件的格式都有差异。为了方便自己后续开发&#xff0c;我写了一个CanMsgRead工具类&#xff0c;只要提供CAN报文路径和CAN报文格式的选项即可将文件迅速读取转换为统一的C…

hiprint结合vue2项目实现静默打印详细使用步骤

代码地址是&#xff1a;vue-plugin-hiprint: hiprint for Vue2/Vue3 ⚡打印、打印设计、可视化设计器、报表设计、元素编辑、可视化打印编辑 本地安装包地址&#xff1a;electron-hiprint 发行版 - Gitee.com 1、先安装hipint安装包在本地 2、项目运行npm&#xff08;socket.…

WPF+MVVM案例实战与特效(四十七)-实现一个路径绘图的自定义按钮控件

文章目录 1、案例效果2、创建自定义 PathButton 控件1、定义 PathButton 类2、设计样式与控件模板3、代码解释3、控件使用4、直接在 XAML 中绑定命令3、源代码获取4、总结1、案例效果 2、创建自定义 PathButton 控件 1、定义 PathButton 类 首先,我们需要创建一个新的类 Pat…

《传染病与人类历史》传染病如何推动人类历史进程

《传染病与人类历史》传染病如何推动人类历史进程 Epidemics: The Impact of Germs and Their Power Over Humanity Joshua S. Loomis&#xff08;约书亚S卢米斯&#xff09;美国&#xff0c;教授&#xff0c;微生物学家。主要教授微生物学、遗传学、免疫学、细胞生物学与传染病…

如何检查交叉编译器gcc工具链里是否有某个库(以zlib库和libpng库为例)

freetype 依赖于 libpng&#xff0c;libpng 又依赖于 zlib&#xff0c;所以我们应该&#xff1a;先编译 安装 zlib&#xff0c;再编译安装 libpng&#xff0c;最后编译安装 freetype。 但是&#xff0c;有些交叉编译器工具链里已经有 zlib库和freetype&#xff0c;所以我们需要…

MySql详细教程-从入门到进阶(超实用)

基础篇 通用语法及分类 DDL: 数据定义语言&#xff0c;用来定义数据库对象&#xff08;数据库、表、字段&#xff09;DML: 数据操作语言&#xff0c;用来对数据库表中的数据进行增删改DQL: 数据查询语言&#xff0c;用来查询数据库中表的记录DCL: 数据控制语言&#xff0c;用…

Burp炮台实现(动态ip发包)

基本步骤 1.使用 zmap 爬取大量代理ip 2.使用py1脚本初步筛选可用ip 3.利用py2脚本再次筛选对目标网站可用ip&#xff08;不带payload安全检测&#xff09; 4.配置 burp 插件并加载收集到的代理池 5.加载payload&#xff0c;开始爆破 Zmap kali安装 sudo apt update apt …

海外招聘丨 苏黎世联邦理工学院—机器学习在社会和政治科学中的应用博士后

雇主简介 苏黎世联邦理工学院是世界领先的科技大学之一。我们以优质的教育、尖端的基础研究和将新知识直接转化为社会而闻名。来自 120 多个国家的 30,000 多名学生认为我们的大学是一个鼓励独立思考和激励卓越的环境的地方。 我们位于欧洲中心&#xff0c;但与世界各地建立联…

【微信小程序】3|首页搜索框 | 我的咖啡店-综合实训

首页-搜索框-跳转 引言 在微信小程序中&#xff0c;首页的搜索框是用户交互的重要入口。本文将通过“我的咖啡店”小程序的首页搜索框实现&#xff0c;详细介绍如何在微信小程序中创建和处理搜索框的交互。 1. 搜索函数实现 onClickInput函数在用户点击搜索框时触发&#x…