请教大佬们一个vue3中watchEffect的问题

vue3官方文档中,组合式函数实例中
useFetch.js中data.value = await res.json()赋值为什么不会触发useFetch.js中的watchEffect

试了一下 App.vue中写watchEffect是可以监听到 useFetch.js文件返回的data。但是useFetch.js文件内的watchEffect监听不到data,但是可以监听到app.vue中的计算属性url

我以为 useFetch.js中的watchEffect内修改data可能会有死循环问题，实际没有。app.vue中的watchEffect内修改data会出现死循环问题。
有大佬解惑吗

首先，要理解 watchEffect 的执行是同步的，但它会追踪其执行期间访问的所有响应式依赖项。当你使用异步代码时，这些依赖项可能在异步操作完成之前就已经被读取了，但 watchEffect 的回调函数会在同步执行后立即返回，不会等待异步操作完成。

effect不会被trigger的方式递归调用，这个在实现里考虑到了这一点

你可以试下usefetch里面改url应该也会死循环，usefetch里面的依赖应该是url而不是data

死循环原因找到了 watchEffect内写这两句就会死循环，不知道为啥。console.log(count.value);setTimeout(() => {count.value = count.value + 1;}, 1000);

你再watcheffect内部修改了依赖，当然死循环了，哪有这么用的，本来就是消除副作用的函数，你非要在制造副作用，先看看文档吧。

因为在函数运行期间没有收集到相关依赖

下载贴吧APP
看高清直播、视频！

分享到: