关于解决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>
相关推荐
爱泡脚的鸡腿13 小时前
uni-app D6 实战(小兔鲜)
前端·vue.js
骑自行车的码农13 小时前
🍂 React DOM树的构建原理和算法
javascript·算法·react.js
北极糊的狐13 小时前
Vue3 中父子组件传参是组件通信的核心场景,需遵循「父传子靠 Props,子传父靠自定义事件」的原则,以下是资料总结
前端·javascript·vue.js
看到我请叫我铁锤14 小时前
vue3中THINGJS初始化步骤
前端·javascript·vue.js·3d
q***252114 小时前
SpringMVC 请求参数接收
前端·javascript·算法
谢尔登14 小时前
defineProperty如何弥补数组响应式不足的缺陷
前端·javascript·vue.js
涔溪15 小时前
实现将 Vue2 子应用通过无界(Wujie)微前端框架接入到 Vue3 主应用中(即 Vue3 主应用集成 Vue2 子应用)
vue.js·微前端·wujie
T***u33316 小时前
前端框架在性能优化中的实践
javascript·vue.js·前端框架
jingling55517 小时前
vue | 在 Vue 3 项目中集成高德地图(AMap)
前端·javascript·vue.js
油丶酸萝卜别吃17 小时前
Vue3 中如何在 setup 语法糖下,通过 Layer 弹窗组件弹出自定义 Vue 组件?
前端·vue.js·arcgis