1. 程式人生 > >關於iview的複選框與前後臺互動問題

關於iview的複選框與前後臺互動問題

靜態頁面
<checkbox-group v-model="pageItem.stu_batch">
  <Checkbox label="1">綜合院校</Checkbox>
  <Checkbox label="2">提前批招生</Checkbox>
  <Checkbox label="3">無批次招生</Checkbox>
  <Checkbox label="4">第一批次招生</Checkbox>
  <Checkbox label="5">第二批次招生A</Checkbox>
  <Checkbox label="6">第二批次招生B</Checkbox>
  <Checkbox label="7">第三批次招生A</Checkbox>
  <Checkbox label="8">第三批次招生B</Checkbox>
</checkbox-group>
//渲染頁面的資料
pageItem:{
stu_batch:[], //定義為陣列(官方api為陣列)
}
與後臺互動的物件(需要與前面pageItem進行賦值)
pageItemAddAndUpd: {
stu_batch:"",//因為我這邊後臺接收的為字串
}
//這裡賦值需要進行判斷(因為如果是返回時空值沒有填資料的話需要進行判斷)
if(response.data.datalist[0].stu_batch==""||response.data.datalist[0].stu_batch==null){
  this.pageItem.stu_batch = [];
}else{
  this.pageItem.stu_batch = JSON.parse(response.data.datalist[0].stu_batch);
}

//這裡是儲存操作

this.pageItemAddAndUpd.stu_batch = JSON.stringify(this.pageItem.stu_batch)//需要將陣列轉化成字串進行後臺儲存