鍍金池/ 問答/HTML/ element 怎么去控制每一行的 switch 狀態(tài)

element 怎么去控制每一行的 switch 狀態(tài)

怎么根據(jù)后端返回值 去控制每一行的狀態(tài)? 主要是怎么控制每一行? 直接寫scope.row.on 報(bào)錯(cuò)scope,拿不到

clipboard.png

       this.$get('/api/shop', this.getDate).then(res => {
          console.log(this.scope); //undefined     
          console.log(scope);      //scope is not defined
      }



      <el-table-column width="200%" label="狀態(tài)" class="switchVal">
        <template slot-scope="scope">
          <el-switch
            @change="changeSwitch(scope.$index, scope.row)"
            v-model="scope.row.on"
            active-text="啟用"
            inactive-text="">
            on-color="#00A854"
            on-text="啟動(dòng)"
            on-value="1"
            off-color="#F04134"
            off-text="禁止"
            off-value="0"
            >
          </el-switch>
        </template>
      </el-table-column>
      
      
      
      
   changeSwitch(index, row) {
    if (row.on) {
      this.$confirm('是否確認(rèn)啟用', '提示', {
        confirmButtonText: '確定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        row.on = true
      }).catch(() => {
        row.on = false
      });
    }else {
      this.$confirm('禁用后,該商戶的前臺(tái)頁面將無法正常訪問,是否確認(rèn)禁用?', '提示', {
        confirmButtonText: '確定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        row.on = false
      }).catch(() => {
        row.on = true
      });
    }
  },
回答
編輯回答
孤客

MVVM以數(shù)據(jù)為驅(qū)動(dòng),數(shù)據(jù)修改了View自然就變了。所以去改變v-model就行了

2018年5月20日 02:15
編輯回答
大濕胸

你這不是寫了嗎,在數(shù)據(jù)里面每一行都添加一個(gè)字段on,或者叫其他的。是一個(gè)布爾值,然后通過修改這個(gè)值還更新switch.,揮著switch的變化也能立刻更改到這個(gè)值上面

scope.row.on
2018年5月27日 15:45
編輯回答
任她鬧

現(xiàn)在是scope拿不到唄 和控制開關(guān)有關(guān)系么
把賦值scope的代碼貼出來 怎么取的

2017年9月14日 16:07