若依 ruoyi-vue element-ui el-cascader 级联选择器 选择任意一级选项,去掉单选按钮,选中点击后隐藏

news2024/11/24 19:09:41

Cascader 级联选择器 选择任意一级选项,去掉单选按钮。
这兄弟文章写的可以,查了一堆文章,基本搞完才发现。

官方的例子不支持选中后自动关闭,要点击旁边空白,并且单选框太小了。
在这里插入图片描述

              <el-form-item label="所属地域" prop="areaCode">
                <el-cascader
                    style="width: 100%"
                    ref="cascader"
                    v-model="form.areaCode"
                    :options="tzSysTreeDictOptions"
                    @change="handleCascaderChange"
                    :props="{ expandTrigger: 'hover', label: 'name' ,emitPath: false,checkStrictly: true }"
                    placeholder="选择所属地域"
                />
              </el-form-item>
    handleCascaderChange(){
      this.$refs.cascader.dropDownVisible = false;
    },

全局样式,他们文章样式有问题,会导致el-radio-group 组件的单选框也消失

//el-cascader 单选框不显示,点击即选中
.el-cascader-node .el-radio__inner {
  border-radius: 0;
  border: 0;
  width: 170px;
  height: 34px;
  background-color: transparent;
  cursor: pointer;
  box-sizing: border-box;
  position: absolute;
  top: -18px;
  left: -19px;
}

.el-cascader-node .el-radio__input.is-checked .el-radio__inner {
  background: transparent;
}

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

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

相关文章

AIGC之Stable Diffusion Web Ui 初体验

前言 Stable Diffusion辣么火&#xff0c;同学你确定不尝试一下嘛&#xff1f; 纯代码学习版本搞啦&#xff0c;Web Ui 也得试试咧 网上有很多安装Stable Diffusion Web Ui 的介绍了&#xff0c;我在这说一下我的踩坑记录 想安装的同学&#xff0c;看这个链接 万字长文&#x…

6.4学习总结

Codeforces Round 950 (Div. 3)A、B题解 解题思路 开一个数组来记录A,B,C,D,E,F,G难度题目出现的次数&#xff0c;因为每一轮比赛都需要每一种难度都有一题&#xff0c;所以我们只要根据要出的比赛的轮数对每一个难度的题目进行自减&#xff0c;最后遍历数组把所有为负数的题目…

【NI国产替代】电池模拟器,快速模拟 3C 产品电池的充放电功能

电池模拟器 快速模拟 3C 产品电池的充放电功能输出灵活可调节的电压/电流内置双向 DC-DC 降压变换器为 3C 产品提供漏电检测 电池模拟器系列包含单节双通道&#xff08;1S&#xff09;、双节双通道&#xff08;2S&#xff09;、三节单通道&#xff08;3S&#xff09;三种规格&…

三十六篇:未来架构师之道:掌握现代信息系统典型架构

未来架构师之道&#xff1a;掌握现代信息系统典型架构 1. 引言 在企业的数字化转型浪潮中&#xff0c;信息系统架构的角色变得日益重要。它不仅承载了企业的IT战略&#xff0c;更是确保企业在复杂、动态的市场环境中稳定运行的关键。作为信息系统的骨架&#xff0c;一个精心设…

张量之力:人工智能的多维舞台

在人工智能&#xff08;AI&#xff09;的广阔天地里&#xff0c;张量&#xff08;Tensor&#xff09;这一数学概念如同璀璨的明星&#xff0c;以其独特的魅力和强大的功能&#xff0c;为AI技术的发展和应用注入了新的活力。张量&#xff0c;这个源自物理学的概念&#xff0c;如…

【云原生Kubernetes项目部署】k8s集群+高可用负载均衡层+防火墙

目录 环境准备 拓朴图 项目需求 一、Kubernetes 区域可采用 Kubeadm 方式进行安装 1.1所有节点master、node01、node02 1.2所有节点安装docker 1.3所有节点安装kubeadm&#xff0c;kubelet和kubectl 1.4部署K8S集群 1.4.1复制镜像和脚本到 node 节点&#xff0c;并在 …

数据总线、位扩展、字长

数据总线&#xff08;Data Bus&#xff09; 定义 数据总线是计算机系统中的一组并行信号线&#xff0c;用于在计算机内部传输数据。这些数据可以在中央处理器&#xff08;CPU&#xff09;、内存和输入/输出设备之间传输。 作用 数据传输&#xff1a;数据总线负责在计算机各…

中间代码生成

一&#xff0e;实验题目 DO-WHILE循环语句的中间代码生成 二&#xff0e;实验目的 通过设计、编制、调试一个 do-while 循环语句的语法及语义分析程序&#xff0c;加深对 法及语义分析原理的理解&#xff0c;并实现词法分析程序对单词序列的词法检查和分析。 三&#xff0e; 实…

SploitScan:一款多功能实用型安全漏洞管理平台

关于SploitScan SploitScan是一款功能完善的实用型网络安全漏洞管理工具&#xff0c;该工具提供了用户友好的界面&#xff0c;旨在简化广大研究人员识别已知安全漏洞的相关信息和复现过程。 SploitScan可以帮助网络安全专业人员快速识别和测试已知安全漏洞&#xff0c;如果你需…

读书笔记-《软件定义安全》之二:SDN/NFV环境中的安全问题

第2章 SDN/NFV环境中的安全问题 1.架构安全 SDN强调了控制平面的集中化&#xff0c;从架构上颠覆了原有的网络管理&#xff0c;所以SDN的架构安全就是首先要解决的问题。例如&#xff0c;SDN实现中网络控制器相关的安全问题。 1.1 SDN架构的安全综述 从网络安全的角度&…

基于Win11下的Wireshark的安装和使用

Wireshark的安装和使用 前言一、Wireshark是什么简介 二、下载Wireshark下载过程查看自己电脑配置 三、安装Wireshark安装过程安装组件创建快捷方式winPacpNpcap 打开检验 四、使用Wireshark实施抓包捕获数据包 五、基于Wireshark使用显示过滤器简介使用方法注意ICMP的请求和应…

vue3+ts+vite项目开发--知识点梳理01

vue3tsvite项目开发--知识点梳理01 创建vue3项目01 tsconfig.node.json文件中extends报错02 知识点&#xff1a;用nvm安装最新版本的node03. template标签中的#表示啥意思04 ts中 &#xff1f;&#xff1f;使用05 ts中 reduce06 vue3ts中watch和watchEffect监听使用07 unocss用…

大屏可视化建设方案(word)

1.系统概述 1.1.需求分析 1.2.重难点分析 1.3.重难点解决措施 2.系统架构设计 2.1.系统架构图 2.2.关键技术 2.3.接口及要求 3.系统功能设计 3.1.功能清单列表 3.2.数据源管理 3.3.数据集管理 3.4.视图管理 3.5.仪表盘管理 3.6.移动端设计 3.1.系统权限设计 3.…

RTOS笔记--信号量+互斥量+事件组

信号量的本质 信号量是一个特殊的队列&#xff0c;但并不涉及数据传输&#xff0c;因此不需要读写位置和发送者列表&#xff0c;但是多了一个最大计数值。 个人理解&#xff1a;信号量类似一个加入了保护机制的全局变量&#xff0c;不会因为中断切换的原因而导致数据出错。 信号…

计算机缺失msvcp100.dll如何解决?教你5种简单高效的修复方法

在现代科技发展的时代&#xff0c;计算机已经成为我们生活和工作中不可或缺的工具。然而&#xff0c;在使用计算机的过程中&#xff0c;我们常常会遇到各种问题和困扰。其中之一就是计算机找不到msvcp100.dll文件。这个问题可能会给我们的生活和工作带来很多不便&#xff0c;下…

Unity2D游戏制作入门 | 09(之人物动画制作)

上期链接&#xff1a;Unity2D游戏制作入门 | 08-CSDN博客 人物走路动画逻辑补充&#xff08;该帖没有的内容&#xff0c;我给补充了请先看完这帖&#xff0c;再去看补充&#xff09;&#xff1a;人物按下shifit走路动画设定09&#xff08;第九期先行补充&#xff09; 上期我们…

Git之解决重复输入用户名和密码(三十九)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 优质专栏&#xff1a;多媒…

机器学习--损失函数

损失函数&#xff08;Loss Function&#xff09;&#xff0c;也称为代价函数&#xff08;Cost Function&#xff09;或误差函数&#xff08;Error Function&#xff09;&#xff0c;是机器学习和统计学中的一个重要概念。它用于量化模型预测值与真实值之间的差异。损失函数的值…

Mybatis04-使用注解开发

面向接口编程 面向接口编程 我们之前都学过面向对象编程&#xff0c;也学习过接口&#xff0c;但在真正的开发中&#xff0c;很多时候我们会选择面向接口编程 根本原因 : 解耦 , 可拓展 , 提高复用 , 分层开发中 , 上层不用管具体的实现 , 大家都遵守共同的标准 , 使得开发变…

makefile与进度条

Linux项目自动化构建工具-make/makefile make是一个命令&#xff0c; makefile是一个文件&#xff0c;保存依赖关系和依赖方法。‘ touch Makefile/makefile mybin:mytest.c//依赖关系 目标文件&#xff1a;依赖文件列表 文件列表的文件之间以空格分隔 gcc -o mybin mytest.…