vue中cascader级联选择中数据的已勾选内容错乱问题

【记录】

点击第一列的内容会更新第三列的数据，这里我先选择了①，在选择第三列的一些选项后，再点击②，选择一些选项后再返回到①，此时第三列已选的选项已经错乱，选中了此前未被选中的内容，再返回到②同样如此。

【对应措施-例子】

created(){
	this.filterList1 = JSON.parse(JSON.stringify(this.items)) // ！！！关键步骤，深拷贝！！！
	
	// this.items是接口请求返回的数据，从父组件传递进来
	// this.filterList1是子组件的字段，简略版结构如下：
	
	// [
	//	{
	//		name:'',
	//		id:'',
	//		...
	//		children:[
	//			{
	//				id:'',
	//				name:'',
	//				...
	//			}
	//		]
	//	}
	//]
	
}

---------------------------------------------------------------------------------------------
第二次更新：发现上面的做法很诡异，并不能保证时时刻刻都能得到想要的结果，因此又寻找了一种新的解决方法，如下：

//第一列
<v-list-item v-for="item in filterList1" @click="getList3(item)">
	...
</v-list-item>

//第三列
<v-list-item v-for="item in selectedObjInList1.children">
	//多选框
	<v-checkbox v-model="selectedList3"></v-checkbox> // ！！！关键，v-model与对象里的数组绑定总会有奇奇怪怪的问题，因此选择了直接新建一个新的变量来存放！！！（原来是selectedObjInList1.arr）
	...
</v-list-item>

//selectedObjInList1是每一次第一列点击时对应的那个数组中的item对象