解决Element组件el-switch在Vue中值的绑定与回显问题

概要

Switch 开关表示两种相互对立的状态间的切换,多用于触发「开/关」。可当一个布尔值进行使用。

问题描述与解决

引入Element组件的switch到Vue中,可以读取switch的值,但如果放在页面中,不能回显上去。

如上图,无论值是"否"还是“是”。都不能正确渲染到页面上。其代码如下:

<el-form-item label="发布试卷" prop="publish">
              <el-switch
                v-model="form.publish"
                active-text="是"
                inactive-text="否"
                active-value="1"
                inactive-value="0">
              </el-switch>
            </el-form-item>

一开始,我也怀疑是这个值的类型对不上,当然官方文档说的是boolean / string / number都可以。所以我犹豫了。逐渐排查原因。

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Spring服务启动后就执行某个方法

下边按照执行顺序前后&#xff0c;测试代码结果截图放到最后&#xff1a; 1、注解PostConstruct 时间&#xff1a;当前bean被创建并且所有的依赖注入完成之后执行&#xff1b; 使用&#xff1a;当前bean 所在类内的某个方法上 添加该注解&#xff1b;该方法没有参数&#xf…

宝塔PHP环境安装配置Xdebug

宝塔PHP环境安装配置Xdebug 安装XdebugVSCode安装插件编辑配置文件编辑配置运行调试断点快捷键其他 安装Xdebug 在宝塔中&#xff0c;找到PHP&#xff0c;打开管理页面&#xff0c;选择xdebug扩展&#xff0c;点击操作栏中的安装按钮&#xff08;这里已经安装过了&#xff0c;…

dolphinscheduler standalone安装

官方文档&#xff1a;https://dolphinscheduler.apache.org/en-us/docs/3.1.3/guide/installation/standalone 1.安装&#xff08;以放在/home为例&#xff09; 下载见&#xff1a;https://download.csdn.net/download/taotao_guiwang/89311365 tar -xvzf apache-dolphinsche…

【Linux系统编程】进程概念、进程排队、进程标识符、进程状态

目录 什么是进程&#xff1f; 浅谈进程排队 简述进程属性 进程属性之进程标识符 进程操作之进程创建 初识fork fork返回值 原理角度理解fork fork的应用 进程属性之进程状态 再谈进程排队 进程状态 运行状态 阻塞状态 挂起状态 Linux下的进程状态 “R”(运行状…

02.爬虫---HTTP基本原理

02.HTTP基本原理 1.URI 和 URL 的区别2.HTTP 和 HTTPS 的区别3.请求过程 1.URI 和 URL 的区别 URL&#xff08;Uniform Resource Locator&#xff09;即-统一资源定位符 URL是用来定位和访问互联网上资源的独特标识&#xff0c;它包括了资源的位置&#xff08;如IP地址或域名&a…

让写书人勇敢穿越纸海的迷雾

坚守纸海&#xff1a;让写书人勇敢穿越纸海的迷雾 你作为一位写书人&#xff0c;在创作过程中你需要坚守初心是非常重要的。在创作的过程中&#xff0c;你会遇到各种挑战和困难&#xff0c;你要勇敢面对迷雾中的挑战&#xff0c;并通过不懈的努力和决心&#xff0c;成功地穿越…

Redis常见数据类型(6)-set, zset

目录 Set 命令小结 内部编码 使用场景 用户画像 其它 Zset有序集合 普通指令 zadd zcard zcount zrange zrevrange ​编辑 zrangebyscore zpopmax/zpopmin bzpopmax/bzpopmin zrank/zrevrank zscore zrem zremrangebyrank zremrangebyscore Set 命令小结 …

AI绘画基础,建议用天工 AI 搞副业,30 分钟搞定儿童早教内容

现在 AI 非常火&#xff0c;竞争也非常激烈&#xff0c;尤其是国内的 AI 大模型堪称百团大战&#xff0c;非常内卷。 我研究 AI 大模型也有快一年的时间了&#xff0c;也体验了国内的很多大模型&#xff0c;然后我感觉如果单从用户体验的角度来讲&#xff0c;综合产品力最强的…

FPGA状态机设计详解

一.什么是状态机&#xff1f; 想象一下你正在玩一个电子游戏&#xff0c;角色有多种状态&#xff0c;比如“行走”、“跳跃”、“攻击”等。每当你按下不同的按键或者满足某些条件时&#xff0c;角色的状态就会改变&#xff0c;并执行与该状态对应的动作。这就是状态机的一个简…

修改vuetify3的开关组件v-switch在inset模式下的大小

<v-switchv-model"model":label"Switch: ${model.toString()}"hide-detailsinset></v-switch><style lang"scss" scoped> .custom-switch {:deep(.v-switch__thumb) {height: 18px !important; /* 设置开关按钮的高度 */width…

html 引用vue3 element 首次加载缩成一团 挤在一起

问题&#xff1a;原生html引用vue,element plus 分析&#xff1a; vue.js, element脚本过大&#xff0c;首次加载网络慢的话&#xff0c;会是缩在这里&#xff0c;没完全渲染 解决&#xff1a; 没加载之前&#xff0c;不显示div&#xff0c;显示一个加载提示语 改动地方app…

ISCC 2024 部分wp

文章目录 一、Misc1、Number_is_the_key2、FunZip3、擂台—— 重“隐”&#xff1b;4、RSA_KU5、时间刺客6、成语学习7、 精装四合一8、钢铁侠在解密9、有人让我给你带个话10、Magic_Keyboard11、工业互联网模拟仿真数据分析 二、Web1、还没想好名字的塔防游戏2、代码审计3、原…

curl: (60) SSL certificate problem: self-signed certificat

目录&#xff1a; 1、背景2、测试结果 1、背景 今天帮忙客户排查问题&#xff0c;报错请求超时&#xff0c;但是ping客户的ip以及测试端口都是通的&#xff0c;最终不得不从中台服务器上发起请求客户回调接口&#xff0c;报错如下&#xff1a; 怀疑是客户的证书有问题&#xf…

代码随想录算法训练营第十七天(py)| 二叉树 | 513.找树左下角的值、112. 路径总和、106.从中序与后序遍历序列构造二叉树

513.找树左下角的值 力扣链接 给定一个二叉树的 根节点 root&#xff0c;请找出该二叉树的 最底层 最左边 节点的值。 思路 层序遍历 层序遍历之后&#xff0c;取最后一个数组的第一个元素 class Solution:def findBottomLeftValue(self, root: Optional[TreeNode]) -> …

Python线程

Python线程 1. 进程和线程 先来了解下进程和线程。 类比&#xff1a; 一个工厂&#xff0c;至少有一个车间&#xff0c;一个车间中至少有一个工人&#xff0c;最终是工人在工作。 一个程序&#xff0c;至少有一个进程&#xff0c;一个进程中至少有一个线程&#xff0c;最终…

C++初探_右值引用

左值&#xff1a;在内存中有确定的存储地址。 右值&#xff1a;可出现在赋值表达式右边。包括&#xff1a;字面常量、诸如xy等的表达式&#xff0c;以及返回值的函数。 代码&#xff1a; #include <iostream> using namespace std;int main() {int x 10;int y 13;int…

⌈ 传知代码 ⌋ 基于扩散模型的无载体图像隐写术

&#x1f49b;前情提要&#x1f49b; 本文是传知代码平台中的相关前沿知识与技术的分享~ 接下来我们即将进入一个全新的空间&#xff0c;对技术有一个全新的视角~ 本文所涉及所有资源均在传知代码平台可获取 以下的内容一定会让你对AI 赋能时代有一个颠覆性的认识哦&#x…

Mybatis-Plus笔记

1.MP基础 1.1 MP常见注解 TableName(“指定表明”) TableName("tb_user") // 指定表名 Data NoArgsConstructor AllArgsConstructor Builder public class User {private Long id;private String userName;private String password;private String name;private I…

软件设计师备考 | 案例专题之数据流图 概念与例题

案例分析专题大纲&#xff1a; 数据流图基本概念 基本图形元素&#xff1a;外部实体、加工、数据存储、数据流 数据流&#xff1a;由一组固定成分的数据组成&#xff0c;表示数据的流向。在DFD中&#xff0c;数据流的流向必须经过加工。加工&#xff1a;描述了输入数据流到输出…

Ubuntu22.04虚拟机设置静态IP

虚拟机设置静态IP 按下电脑的 “win”键&#xff0c;在弹出的输入框中输入“控制面板”&#xff0c;选中控制面板 1.选择 “网络和Internet” 2.选择 “网络和共享中心” 3.选择 “更改适配器设置” 4.选择 “VMnet8”&#xff0c;双击打开 5.选择 “属性” 找到 “Internet …