vue element ui 使用switch修改状态之前判断

结构部分

<el-switch
    @change="changeStatus($event, scope.row)"
    active-color="#13ce66"
    v-model="scope.row.enable"
    :active-value="1"
    :inactive-value="0"
    inactive-color="#dadbdf"     
></el-switch>

逻辑部分

changeStatus(callback, row) {
  let text = ''
  if (callback == 1) {
    text = '开启'
    row.enable = 0
  } else {
    text = '关闭'
    row.enable = 1
  }
  this.$confirm(`是否变更状态为${text}`, '提示', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning'
  }).then(async () => {
    let message = ''
    if (row.enable == 0) {
      row.enable = 1
      message = '开启成功'
    } else {
      row.enable = 0
      message = '关闭成功'
    }
    // 逻辑操作
    this.$message({
      type: 'success',
      message
    })
  })
}

文章来源:https://www.jianshu.com/p/8cb963838677

posted @ 2021-02-03 11:14  smil、梵音  阅读(1529)  评论(0编辑  收藏  举报