通常情况下我们渲染子组件时,根据业务需求会需要从父级传递数据到该子组件进行渲染。
一般情况下如果子组件是单次渲染或者该页面中该子组件只渲染一次的话,只需要将props中的数据直接赋值到data中完成渲染即可。
或者直接在组件中使用props中传递过来的值也可以,不必再赋值到data中。我这边赋值到data中主要是为了后续使用该数据方便。
但是,在实际生产过程中,我们需要在一个页面上渲染该子组件多次,这就会导致组件之间的值会出现错乱,比如A处子组件的值展示的是B处子组件的值。这时我们需要使用到vue中的computed和watch完成props中数据到子组件的及时更新。
在template渲染中,需要将对应的值修改为computed中返回的值:
具体原因后有机会补充,如有错误请指正。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。