关于elementUI el-table 赋值污染原有数据的问题解决办法

关于elementUI el-table 赋值污染原有数据的问题解决办法

问题描述

最近在开发公司项目，然后和后台小伙伴联调接口的时候发现，接口返回数据正常，但是给table赋值的时候发现，response的数据被改写的问题，先上代码

getIntroduceList(data).then(res=>{
     console.log(res.data)
     that.introducerData = res.data
    //that.introducerData=JSON.parse(JSON.stringify(res.data))
   // that.introducerData.pagination = pagination
   // that.loading.listloading = false
});

接口返回，可以看到list下面的inactive是正常显示的

问题来了，我在浏览器打印，没结果变成了false，生气

然后就是各种尝试，摸不着头脑

解决办法

原来是UI页面中的问题

修改之前

<el-table-column label="有效"  >
      <template slot-scope="scope">
           <el-switch 
            v-model="scope.row.isActive"  
            v-on:change="upIsActive(scope.row)"
           >
           </el-switch>          
      </template>
                        
 </el-table-column>

修改之后

<el-table-column label="有效"  >
      <template slot-scope="scope">
           <el-switch 
            v-model="scope.row.isActive"
            :active-value="1" 
            :inactive-value="0"
            v-on:change="upIsActive(scope.row)"
           >
           </el-switch>          
      </template>
                        
 </el-table-column>

主要问题就是没有设置active-value和 inactive-value导致的。