关于解决switch开关属性中active-value=“1“为数值形失败的问题

问题详述

如下列代码中,我想让switch打开的值(active-value)和switch关闭的值(inactive-value)都取成数值形,但是目前是把属性设置为字符串"1"。

因为等号右边的内容是包含在引号中的,所以Vue会将其视为字符串。

javascript 复制代码
       <el-table-column label="状态" align="center" width="80">
          <template slot-scope="scope">
            <el-switch
              v-model="scope.row.onlineStatus"
              active-value= "1"
              inactive-value= "0"
              @change="handleStatusChange(scope.row)"
              v-hasPermi="['net:gw:switchStatus']"
            ></el-switch>
          </template>
        </el-table-column>

解决办法

把active-value = "1"前面加上":"号,即:active-value= "1"。

这将属性值设置为数值1,冒号表示这是一个动态绑定,Vue会将等号右边的内容作为javascript代码进行解析,所以1被视为数值。

javascript 复制代码
          <template slot-scope="scope">
            <el-switch
              v-model="scope.row.onlineStatus"
              :active-value= "1"
              :inactive-value= "0"
              @change="handleStatusChange(scope.row)"
              v-hasPermi="['net:gw:switchStatus']"
            ></el-switch>
          </template>
相关推荐
Jammingpro1 小时前
【Vue专题】前端JS基础Part1(含模版字符串、解构赋值、变量常量与对象)
前端·javascript·vue.js
quweiie8 小时前
thinkphp8+layui多图上传,带删除\排序功能
前端·javascript·layui
闲蛋小超人笑嘻嘻9 小时前
树形结构渲染 + 选择(Vue3 + ElementPlus)
前端·javascript·vue.js
巴博尔9 小时前
uniapp的IOS中首次进入,无网络问题
前端·javascript·ios·uni-app
焚 城9 小时前
UniApp 实现双语功能
javascript·vue.js·uni-app
会写代码的饭桶10 小时前
Jenkins 实现 Vue 项目自动化构建与远程服务器部署
vue.js·自动化·jenkins
被巨款砸中10 小时前
前端 20 个零依赖浏览器原生 API 实战清单
前端·javascript·vue.js·web
文韬_武略10 小时前
web vue之状态管理Pinia
前端·javascript·vue.js
董世昌4110 小时前
js怎样改变元素的内容、属性、样式?
开发语言·javascript·ecmascript
mosen86810 小时前
【Vue】Vue Router4x关于router-view,transtion,keepalive嵌套写法报错
前端·javascript·vue.js