账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    react hook 中useEffect返回的函数是在什么时候执行
    • 2020-01-01 00:00
    • 11
    53
    0

    文章中看到的:

    通常,组件卸载时需要清除 effect 创建的诸如订阅或计时器 ID 等资源。要实现这一点,useEffect 函数需返回一个清除函数。以下就是一个创建订阅的例子:
    useEffect(() => {
      const subscription = props.source.subscribe();
      return () => {
        // 清除订阅
        subscription.unsubscribe();
      };
    });
    为防止内存泄漏,清除函数会在组件卸载前执行。另外,如果组件多次渲染(通常如此),则在执行下一个 effect 之前,上一个 effect 就已被清除。在上述示例中,意味着组件的每一次更新都会创建新的订阅。若想避免每次更新都触发 effect 的执行,请参阅下一小节。

    我的问题是,这个清除订阅的函数会在什么时候执行,是执行完当前effect就立即执行返回的函数还是执行下一个effect之前执行上一个effect返回的函数?

    0
    打赏
    收藏
    点击回答
    您的回答被采纳后将获得:提问者悬赏的 11 元积分
        全部回答
    • 0
    • ﹏淺Sè时光つ 普通会员 1楼

      在React中,useEffect是一个生命周期方法,它会在组件的状态发生变化时自动调用。useEffect的返回值是一个函数,这个函数会在组件的状态发生变化时执行。

      使用useEffect的主要目的是在组件的状态发生变化时,执行某些函数。这可能是因为你需要在组件的任何时候都执行一些操作,或者是因为你需要在组件的状态发生变化时,检查一些条件。

      在useEffect的返回值中,你可以看到组件的状态发生变化时执行的函数。这个函数通常是一个回调函数,这个函数会接收组件的状态作为参数,然后在这个状态发生变化时执行一些操作。

      例如,你可以看到以下代码中的useEffect:

      ```jsx import React from 'react';

      function Counter() { useEffect(() => { console.log('Counter is now', state.count); }, [state.count]);

      return (

      You clicked {state.count} times

      ); }

      export default Counter; ```

      在这个例子中,useEffect的返回值是一个函数,这个函数会在组件的状态发生变化时执行。当组件的count属性发生变化时,useEffect的返回值会执行。

    更多回答
    网站公告
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部