问题:最近在使用vue做项目时,遇到一个关于子组件用props接收父组件传递过来的数据进行页面渲染时第一次打开页面数据不能加载的问题,我的子组件是一个对话框,第一次打开对话框时不能加载到父组件传递的数据,关闭后从新打开数据才能加载。刚开始我的方法如下:

父组件:
在这里插入图片描述
子组件:使用watch来响应数据的变化,普通的监听方式,写一个监听函数,这种方式在对话框第一次打开的时候无法加载到数据。
在这里插入图片描述

后来采用hander+immediate的方式,改变watch的监听方法,将immediate设置为true,就可以实现我们第一次打开子组件时加载到数据。
在这里插入图片描述
不设置immediate时,当值第一次绑定的时候,不会执行监听函数,只有值发生改变才会执行;如果我们需要在最初绑定值的时候也执行函数,则需要用到immediate属性。
这里的immediate有true和false属性,两个属性的区别如下:
(1)属性设置为true时,在watch中首次绑定的时候立即执行handle函数。
(2)属性设置为false时,和使用普通方式一样,只有在数据发生变化的时候才执行handler。

Logo

前往低代码交流专区

更多推荐