element Switch组件使用方式项目实战

<el-table-column label="账户状态" align="center" width="180px">
  <template v-slot="scope">
     <el-switch active-value="1" inactive-value="0" v-model="scope.row.sfyx" active-text="启用" @change="updateUserState(scope.row)" inactive-text="停用" active-color="#13ce66" inactive-color="#ff4949"></el-switch>
  </template>
</el-table-column>

// 启用禁用
    async updateUserState(row) {
    
    
      let options = {
    
    
        yhbh: row.yhbh,
        zhbh: row.zhbh,
        zh: row.zh,
        sfyx: row.sfyx
      };
      try {
    
    
        let {
    
     data: res } = await updateAccountStatus(options);
        if (res.code !== 200) {
    
    
          return;
        }
        this.$message.success(`${
      
      row.sfyx === '1' ? '启用' : '停用'}成功`);
        this.onSubmit()
      } catch (error) {
    
    
        return error;
      }
    }