el-table使用el-switch选择器没效果

出现问题的代码:

0表示启用,1表示禁用,发现页面根本没有效果,百思不得其解,查阅资料,恍然大悟。

javascript 复制代码
 <el-table :data="userList" stripe border style="width: 100%" height="500">
        <el-table-column prop="status" label="用户状态" width="120">
            <template #default="scope">
                <el-switch v-model="scope.row.status" style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
                    active-value=0 inactive-value=1 />
            </template>
        </el-table-column>
    
</el-table>

解决:

active-value没加冒号,值是字符串,所以一直匹配不上数字,需要在属性前面添加:号,才能读取到数字。

javascript 复制代码
 :active-value=0 :inactive-value=1
相关推荐
lemon_sjdk10 分钟前
JavaScript 常用关键字全解析
开发语言·javascript·ecmascript
妖孽白小白20 分钟前
el-select的内容续写实现
前端·vue.js·elementui
梨想橙汁36 分钟前
Pinia 状态管理实战:定义 Store、修改数据、模块拆分
前端·vue.js
高申航42 分钟前
Vue 3 + DYMO Connect Framework 实战:从标签模板到打印服务的完整实现
前端·javascript·vue.js
梨想橙汁1 小时前
Vue3 组件开发:生命周期钩子,组件之间通信全方案
前端·vue.js
雪芽蓝域zzs1 小时前
分页组件 + el-config-provider 中文国际化 + 靠右布局
前端·javascript·vue.js
志尊宝1 小时前
Vue3 零基础每日笔记(016):v-for 列表渲染——key 的作用与为什么不能用 index
javascript·vue.js·笔记
toooooop82 小时前
thinkphp查询数据表最后的自增id
前端·javascript·数据库
honkun62 小时前
vue 甘特图组件 vxe-gantt 配置拖拽调整任务起止日期时实时显示 Tooltip 提示
javascript·vue.js·甘特图·vxe-gantt
计算机毕设定制辅导-无忧学长2 小时前
《基于SpringBoot的家政服务管理平台的设计与实现》
java·vue.js·spring boot·计算机毕业设计选题推荐·家政服务管理平台