Vue 父组件 传值 子组件 不生效

原理

原因：
子组件加载时父组件数据未刷新/未请求到，父组件直接将默认值赋给子组件。
会导致null、undefined等情况。

解决方法
通过 watch 监听属性的变化后，调用子组件方法刷新子组件内的值。

父组件.Vue

image.png image.png

子组件.Vue

image.png

拓展

父子组件传值还可以通过 provide 和 inject 方法传递和接收。