我也不知道这算不算是一个bug,可能是一种机制。 先看代码
组件:
const emits = defineEmits(['update:selectList']);
// 多选表格
const selectionChange = (e) => { // 多选
console.log(e.detail.index)
emits("update:selectList", e.detail.index);
}
页面:
<editor-table v-model:selectList="selectList" />
const selectList = ref([]);
watch(()=>selectList.value, (newV)=>{
console.log(selectList.value);
},{
deep: true,
immediate: true
})
此时控制台打印的结果就是,当组件改变selectList有值的时候,页面是可以接收到的,但是一旦传值为空数组,页面就再也接不到值了,即使后面有非空数组传入。
但是当你将代码这样写
// 多选表格
const selectionChange = (e) => { // 多选
console.log(e.detail.index);
if(e.detail.index.length <= 0) {
emits("update:selectList", []);
}else{
emits("update:selectList", e.detail.index);
}
}
结果回变得截然不同,手动传入空数组不会有任何问题,这个问题让我百思不得其解。
有大佬愿意为我解答一下吗