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) // 没有警告了,依然生效
  }
})


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



猜您在找 vue3 父组件调用子组件 方法和属性 子组件 修改父组件的属性值 vue—子组件修改父组件的值 vue3