原因:
起因是我在父组件中把一个id传递给子组件,希望在子组件中调用接口查询数据展示,我只需要在父组件中修改为不同的id即可
希望很美好,可事实却出人意料,每次查询的时候id总是上一个值(一开始id是0),导致结果总不对
大致代码如图所示,父组件按钮触发事件,修改num值,然后调用子组件的方法打印num值
在网上查询了很久,只有解决方法,没有具体原因说明,这里记录一下原因:
在Vue中,当父组件通过ref调用子组件方法时,这个调用是立即执行的,而打印数据也是同步进行的。但是,Vue的响应式系统会监测到props数据的改变,并在下一个事件循环周期中通知子组件进行更新。因此,当你在父组件中修改了props传递给子组件的数据后,子组件的更新是异步进行的,也就是说,子组件的更新会在下一个事件循环周期中执行。
由于子组件的更新是异步进行的,所以在父组件中立即打印props数据时,打印出来的值会是修改前的旧值,而不是修改后的新值。只有在下一个事件循环周期中,当子组件更新完成后,打印出来的值才会是修改后的新值。
解决办法: