列表中el-switch 開關

• 需求說明
  1、根據後臺傳值動態顯示開關（0爲關，1爲開）
  2、對開關進行操作時請求後臺，需要傳兩個參數：ID，State

• 需求描述
  我先說我的需求，我想在列表的每一條添加一個開關，可以改當前一條數據的狀態，併發送到服務端，並根據服務端返回的結果局部刷新當前一條數據

• 期望結果
  已讀和未讀是後端返回給我的狀態，分別是1和2，我先點擊switch發送給後端這條數據的id，然後修改這一條數據的狀態，而不是重新拿這個列表，如果後端返回失敗的情況這個switch不做改變
  

• 解決方法
  Swich默認是boolean類型，而後臺傳值 爲number類型，這個時候我們想用number來取代boolean類型；

  <el-switch v-model="state"
     	 active-value="1"
       inactive-value="2">
  </el-switch>
  

  請注意以面的寫法，active-value和inactive-value的值分別是字符串的1和2,如果你賦值爲數字類型的 1 或 2是無法正常工作的，若賦值爲數值類型，需這樣寫：

  <el-switch v-model="state"
       :active-value="1"
       :inactive-value="2"
       @change=chang($event,state)>
  </el-switch>
  

  我們使用綁定的方式，同時@change可以傳值$event就是switch的當條信息值，state爲參數，還可以再添加index表示當前列表的序號

• 實戰（上代碼）
  

  這裏是方法引用和參數傳遞（參數包括：當前的狀態 $event、當前數據的值對象scope.row、當前的序號scope.$index)

• 結尾
  希望對你有所幫助，有問題歡迎留言，謝謝