Vue.js
对多个标签进行选择时，数据能不能不要实时更新？
粉丝福利 : 关注VUE中文社区公众号，回复视频领取粉丝福利
我现在的结果
是根据读取的数据生成标签，点击修改的时候弹出一个弹窗，把数据传到labelListEait，然后在弹窗里进行修改labelListEait，但是这样原来的 labelList也会随着更改，
正确的思路
应该是用户在弹窗里选择了，原始标签数据不应该变，等我点确定再变，或者我点取消刚才选择的标签就恢复到原来没改的样子。
我做input修改和添加删除就通过浅拷贝方法弄成功了，这个就没办法了
html
<dt>
<span>特色标签</span>
<el-button type="text" @click="labelEait">修改</el-button>
</dt>
<div class="companylabel-list clearfloat">
<li :class="item.check==1?'labelList':''" v-for="(item,index) in ReWorkList.labelList" :key="item.id">
{{item.name}}
</li>
</div>
<transition name="fade">
<div class="zqs-popup-content clearfloat">
<div class="companylabel-list">
<li class="pointer" :class="item.check==1?'labelList':''" v-for="(item,index) in labelListEait" :key="item.id" @click="labelActive(index)">
{{item.name}}
</li>
</div>
</div>
</transition>
自定义的标签数据是这样子的
labelEaitStatus:false,
ReWorkList:{
labelList:[
{name:'零增项',value:1,check:1,},
{name:'自创工艺',value:2,check:1,},
{name:'装修贷款',value:3,check:0,},
{name:'标准化施工',value:4,check:0,},
{name:'自建工厂',value:5,check:0,},
{name:'先装修后付款',value:6,check:0,},
{name:'到店接送',value:7,check:0,},
{name:'实景展厅',value:8,check:0,},
{name:'甲醛检测治理',value:9,check:0,},
{name:'免费设计',value:10,check:0,},
{name:'免费报价',value:11,check:0,},
{name:'免费验房',value:12,check:0,},
],
},
labelListEait:[],
methods:{
这是点击修改的方法
labelEait:function(){
this.labelEaitStatus=true;
this.labelListEait=this.ReWorkList.labelList;
},
这是选择标签的方法
labelActive(index){
const labelListEaits=Object.assign({}, this.labelListEait);
if(this.labelListEait[index].check==1){
this.labelListEait[index].check=0;
this.labelList=labelListEaits;
}else{
this.labelListEait[index].check=1;
}
},
这是点取消的方法
labelEaitCan(){
this.labelEaitStatus=!this.labelEaitStatus;
this.labelListEait="";
},
这是点确定的方法
labelEaitCon: function(){
this.labelEaitStatus=false;
this.ReWorkList.labelList=this.labelListEait;
console.log(this.ReWorkList.labelList)
this.$message({
type: 'success',
message: '完成修改!'
});
},
},
}
有没有vue大神指点一下，，，，
