element ui多选框编辑时无法选中的解决办法

 <!--v-model绑定的值必须是[],不能是字符串--><el-form-item label="配布对象" prop="reptGroupArray" > <!--多选--><el-checkbox-group v-model="form.reptGroupArray" size="small" @change="checkedBoxChange"> <el-checkbox-button v-for="dept in deptMap" :key="dept.deptName" :label="dept.deptName" ></el-checkbox-button></el-checkbox-group>
</el-form-item>

 在上面添加变更事件,然后变更事件中添加this.$forceUpdate();  强制渲染多选框的样式即可

checkedBoxChange(){//console.log("多选框实时变化:" + this.form.reptGroupArray);this.$forceUpdate();  //强制渲染多选框样式,否则值变了样式没有选中
},

注意: 多选框需要传数组,字符串无法正常渲染,因此表单初始化绑定的v-model需要初始化为空数组[],而编辑页面传值时如果是字符串,需要转数组:

this.form.reptGroupArray = this.form.reptGroup.split(','); 

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

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

相关文章

【Qt】QMainWidget中的栏和菜单

默认结构最复杂的标准窗口 提供了菜单栏, 工具栏, 状态栏, 停靠窗口菜单栏: 只能有一个, 创建的最上方工具栏: 可以有多个, 默认提供了一个, 窗口的上下左右都可以停靠状态栏: 只能有一个, 窗口最下方停靠窗口: 可以有多个, 默认没有提供, 窗口的上下左右都可以停靠 菜单栏 在…

11.2 知识总结(RegExp对象、Math对象、Bom和Dom

一、 RegExp对象 1.1 定义正则表达式两种方式 var reg1 new RegExp("^[a-zA-Z][a-zA-Z0-9]{5,11}"); var reg2 /^[a-zA-Z][a-zA-Z0-9]{5,9}$/; 1.2 正则校验数据 reg1.test(jason666) reg2.test(jason666) 1.3 全局匹配 var s1 egondsb dsb dsb; s1.match(/s/)…

emq集群配置nginx做负载均衡

emq集群配置nginx做负载均衡 创建 EMQ X 节点集群 emqx 集群搭建 例如: 节点IP 地址emqx192.168.1.17192.168.1.17emqx192.168.1.18192.168.1.18emqx192.168.1.19192.168.1.19 配置 /etc/nginx/nginx.conf mqtt集群搭建并使用nginx做负载均衡_亲测得结论 示例: vim /et…

Minio多节点多驱动官网文档翻译

原文链接&#xff1a; Deploy MinIO: Multi-Node Multi-Drive — MinIO Object Storage for Linux The procedures on this page cover deploying MinIO in a Multi-Node Multi-Drive (MNMD) or “Distributed” configuration. MNMD deployments provide enterprise-grade p…

【实战Flask API项目指南】之六 数据库集成 SQLAlchemy

实战Flask API项目指南之 数据库集成 本系列文章将带你深入探索实战Flask API项目指南&#xff0c;通过跟随小菜的学习之旅&#xff0c;你将逐步掌握 Flask 在实际项目中的应用。让我们一起踏上这个精彩的学习之旅吧&#xff01; 前言 在上一篇文章中&#xff0c;我们实现了…

day53【子序列】1143.最长公共子序列 1035.不相交的线 53.最大子序和

文章目录 1143. 最长公共子序列1035.不相交的线53. 最大子序和 1143. 最长公共子序列 题目链接&#xff1a;力扣链接 讲解链接&#xff1a;代码随想录讲解 题意&#xff1a;给定两个字符串 text1 和 text2&#xff0c;返回这两个字符串的最长 公共子序列 的长度。如果不存在 …

微信自动回复有什么好处?怎么设置?

微信自动回复有什么好处&#xff1f; 首先&#xff0c;它可以帮助我们节省时间和精力。当我们无法立即回复消息时&#xff0c;自动回复可以及时告知对方我们的状况&#xff0c;避免对方的焦虑和不便。 其次&#xff0c;自动回复可以增强沟通效率。无论是工作还是个人生活中&a…

gtsam初探以及结合LIO-SAM算法的一些理解

概述 GTSAM&#xff08;Georgia Tech Smoothing and Mapping&#xff09;是基于因子图的C库&#xff0c;本篇基于GTSAM对因子图优化做一个简单了解和梳理&#xff0c;并以LIO-SAM为例进一步分析因子图优化在SLAM中的应用。 参考链接&#xff1a; [0]gtsam官方文档 [1]https:/…

mongo常用操作符及查询例子

比较操作符&#xff1a; $eq&#xff1a;匹配字段值等于指定值。 $ne&#xff1a;匹配字段值不等于指定值。 $gt&#xff1a;匹配字段值大于指定值。 $gte&#xff1a;匹配字段值大于或等于指定值。 $lt&#xff1a;匹配字段值小于指定值。 $lte&#xff1a;匹配字段值小于或等…

最小化安装移动云大云操作系统--BCLinux-R8-U2-Server-x86_64-231017版

有个业务系统因为兼容性问题&#xff0c;需要安装el8.2的系统&#xff0c;因此对应安装国产环境下的BCLinuxR8U2系统来满足用户需求。BCLinux-R8-U2-Server是中国移动基于AnolisOS8.2深度定制的企业级X86服务器通用版操作系统。本文记录在DELL PowerEdge R720xd服务器上最小化安…

Redis-分布式锁

Redis-setnx实现分布式锁 Redis实现分布式锁主要利用Redis的setnx命令。setnx是SET if not exists(如果不存在&#xff0c;则SET)的简写。(NX是互斥、EX是设置超时时间) 但是如上会面临一个问题&#xff0c;当业务执行时间太长&#xff0c;导致业务还没执行完锁已到期&#xf…

Flask三种文件下载方法

Flask 是一个流行的 Python Web 框架&#xff0c;它提供了多种方法来实现文件下载。在本文中&#xff0c;我们将介绍三种不同的方法&#xff0c;以便你能够选择最适合你应用程序的方法。 方法一&#xff1a;使用 send_file 函数 send_file 函数是 Flask 中最常用的文件下载方法…

令人深刻的c#工具和库

为了方便大家开发&#xff0c;介绍一些库和框架。 框架 CAP - 具有本地持久消息功能的EventBus&#xff0c;用于SOA或微服务架构中的系统集成。Cinchoo ETL - .NET的ETL框架&#xff08;用于CSV&#xff0c;Flat&#xff0c;Xml&#xff0c;JSON&#xff0c;键值格式文件的分…

CentOS开机自动运行jar程序实现

前面已经有一篇文章介绍jar包如何在CentOS上运行&#xff0c;《在linux上运行jar程序操作记录》 后来发现系统重启后不能自动运行&#xff0c;导致每次都要手动打开&#xff0c;这篇介绍如何自动开机启动运行jar程序。 一、找到JDK程序执行位置 [rootlocalhost /]# which jav…

2.Vue3项目(二):vue项目创建,项目必需的基础依赖配置,项目集成各种第三方依赖

目录 一、环境配置 1.下载node.js 2.pnpm的配置 二、创建项目 1.先创建好项目文件夹

【开题报告】基于 Spring Boot 的在线预约导游系统的设计与实现

1.引言 在旅游行业中&#xff0c;导游起到了重要的作用&#xff0c;他们为游客提供了专业的旅游服务和相关信息。然而&#xff0c;传统的导游预约方式可能存在一些问题&#xff0c;如信息不透明、预约流程繁琐等。因此&#xff0c;我们计划开发一个基于 Spring Boot 的在线预约…

学习笔记二十九:K8S配置管理中心Configmap实现微服务配置管理

Configmap概述 Configmap概述Configmap能解决哪些问题&#xff1f;Configmap应用场景局限性 Configmap创建方法命令行直接创建通过文件创建指定目录创建configmap 编写configmap资源清单YAML文件使用Configmap通过环境变量引入&#xff1a;使用configMapKeyRef通过环境变量引入…

Azure机器学习 - 在 Azure 机器学习中上传、访问和浏览数据

目录 一、环境准备二、设置内核三、下载使用的数据四、创建工作区的句柄五、将数据上传到云存储空间六、访问笔记本中的数据七、创建新版本的数据资产八、清理资源 机器学习项目的开始阶段通常涉及到探索性数据分析 (EDA)、数据预处理&#xff08;清理、特征工程&#xff09;以…

Flutter 使用 dio 遇到的问题合集

泪流满面啊&#xff0c;&#xff0c;&#xff0c;&#xff0c;&#xff0c; 1. postHttpLogin-异常-----DioException [bad response]: The request returned an invalid status code of 500. /// 错误代码如下&#xff1a;Future<String?> postHttpLogin(String textC…

Java 项目 服务器 日志配置

最近 在搞一个0-1的项目 就想把 服务器日志配置 记录一下 我们使用的是 单体微服务项目 首先你需要一个xml <?xml version"1.0" encoding"UTF-8"?> <configuration><!--定义日志存放的位置--><springProperty scope"context&…