Vue3 关于子组件修改父组件属性的疑惑
我们知道,子组件通过 prop
接收父组件的传值,而且子组件也是禁止直接通过 prop
修改父组件的值。
但在 Vue3 中,这个限制似乎被 toRef
打破了。
假设父组件传下面的对象给子组件
{
list: []
}
在 Vue3 的子组件里,如果通过下面的代码修改,会警告
export default defineComponent({
props: {
params: Object
},
setup(props) {
props.params.list.push(1) // 会警告,但依然能生效
}
})
但通过下面的方法修改,就能消除警告
export default defineComponent({
props: {
params: Object
},
setup(props) {
const list = toRef(props.params, 'list')
list.push(1) // 没有警告了,依然生效
}
})