Element Plus 2.2.27 的单选框 Radio 组件,选中一个选项后,全部选项都变为选中状态

html 复制代码
<el-radio-group v-model="myRadio">
    <el-radio value="1">Option 1</el-radio>
    <el-radio value="2">Option 2</el-radio>
</el-radio-group>
js 复制代码
const myRadio = ref("1");
  • 在前端开发中,使用 Element Plus 2.2.27 的单选框 Radio 组件时,遇到了选中一个选项后,全部选项都变为选中状态的问题
问题原因
  1. 这是由于 Element Plus 版本问题导致的,在 2.2.27 版本中,Radio 组件支持是 label 属性,而不是 value 属性

  2. 在 Element Plus 2.6.0 版本后,Radio 组件的开始支持 value 属性

处理策略
  1. 升级 Element Plus 版本到 2.6.0 或更高版本,使用 value 属性来定义选项的值

  2. 如果无法升级 Element Plus 版本,可以使用 label 属性来定义选项的值

html 复制代码
<el-radio-group v-model="myRadio">
    <el-radio label="o1">Option 1</el-radio>
    <el-radio label="o2">Option 2</el-radio>
</el-radio-group>
js 复制代码
const myRadio = ref("o1");
相关推荐
小陈工2 小时前
Python Web开发入门(十七):Vue.js与Python后端集成——让前后端真正“握手言和“
开发语言·前端·javascript·数据库·vue.js·人工智能·python
H Journey2 小时前
C++之 CMake、CMakeLists.txt、Makefile
开发语言·c++·makefile·cmake
xiaotao1316 小时前
第九章:Vite API 参考手册
前端·vite·前端打包
午安~婉6 小时前
Electron桌面应用聊天(续)
前端·javascript·electron
lly2024066 小时前
C 标准库 - `<stdio.h>`
开发语言
沫璃染墨6 小时前
C++ string 从入门到精通:构造、迭代器、容量接口全解析
c语言·开发语言·c++
jwn9996 小时前
Laravel6.x核心特性全解析
开发语言·php·laravel
迷藏4946 小时前
**发散创新:基于Rust实现的开源合规权限管理框架设计与实践**在现代软件架构中,**权限控制(RBAC)** 已成为保障
java·开发语言·python·rust·开源
彧翎Pro7 小时前
基于 RO1 noetic 配置 robosense Helios 32(速腾) & xsense mti 300
前端·jvm
功德+n7 小时前
Linux下安装与配置Docker完整详细步骤
linux·运维·服务器·开发语言·docker·centos