个人技术分享

期望结果:

在这里插入图片描述

表格中组件:

在开关外层用插槽包裹,里面写v-model用来绑定字段

        <!--用插槽包裹el-switch开关-->
        <template #default="scope">
          <el-switch active-text="启用" :active-value=1 active-color="#2fa1f1" inactive-text="停用" :inactive-value=0 inactive-color="#9c9c9c" v-model="scope.row.tradingVolumeStatus" @change="handleStatusChange(scope.row)"/> <!--当tradingVolumeStatus=1时switch开启,当tradingVolumeStatus=0时switch关闭-->
        </template><!--回显的时候 int类型使用 :active-value,字符串类型不加引号-->
1、绑定v-model到一个Boolean类型的变量。可以使用active-color属性与inactive-color属性来设置开关的背景色。

2、使用active-text属性与inactive-text属性来设置开关的文字描述。

3、设置active-value和inactive-value属性,接受Boolean, String或Number类型的值。

绑定事件

function handleStatusChange(row) {
  
  console.log("====="+row);
}