场景
父组件A,子组件B,A组件内调两个接口,两个接口结果作为两个prop传给组件B。
组件B内部存在两个data值a和b,是使用前面两个prop通过计算生成的。在模版渲染时需要使用计算完成的a和b。
a的生成又依赖b。
结论
a和b作为组件内部数据,应该是根据prop的变化而变化,所以只能watch对应的prop,或者使用compute
使用compute的话,模版初次渲染时就会有多个方法在使用a和b,从而报错,改动麻烦,而且这个场景更贴合watch
使用watch immediate能在beforeCreate之前就执行watch回调,使得模版渲染不会报错,问题只在于a和b存在依赖关系
此处前端场景(假如a依赖b),解决方法,1)watch b执行后立刻执行a,watch a执行时判断b如果为空则退出执行;2)watch a执行时若b没有执行就先执行b,watch b则不做修改。两种皆可,条件在于哪一个操作具有幂等性,这里两个都可以多次执行故而都可行。
过程
- watch的执行顺序问题(顺序好像是按代码前后顺序,不过最好不去指望顺序,依赖的处理就让b出结果再执行一遍a)
- 以及compute替代watch的话,执行顺序如何(先无论immediate的watch,再computed)
- prop默认空值,再设置值之后,是否子组件优先触发compute而不是watch(先watch)
- 父组件里created调接口,给子组件prop赋值,子组件created里接收到的值有时为空,这个顺序究竟如何(如果接口赶在mount挂载子组件之前返回,则子组件第一个接收到prop就有新值,否则为默认值,并在接口返回后再修改prop,触发watch和compute)
- 类似于消息执行顺序问题,a和b执行顺序不定,a依赖b的结果,解决办法只有1)执行完b就执行a,若a没准备好,则让a准备好了再发消息再次触发a;2)执行a时判断b没有执行就去想办法等b执行了再次进行a
- 此处前端场景,解决方法1)watch b执行后立刻执行a,watch a执行时判断b有没有执行过;2)watch a执行时若b没有执行就先执行b,watch b不做处理。两种皆可,条件在于哪一个操作具有幂等性,这里两个都可以多次执行故而都可行。