父组件通过props给子组件传值,但子组件无法获得更新后的值

399 阅读1分钟

问题发生: 路由页面内的父组件通过ajax请求获取数据,同时向子组件通过props传递数据,页面主动刷新后,由于父组件数据还没有获得,也没有相应的值传递给子组件,导致子组件渲染错误。

正常页面.jpg

正常页面(如上)

刷新.jpg

刷新页面后,页面发生错误(如上)

mounted.jpg

通过控制台发现页面挂载时没有数据

更新后.jpg

通过watch监听属性,监听props值的变化,同时通过赋值及时更新

恢复.jpg

恢复正常