警告:无法在未安装的组件(React Native,Expo,React Hooks)上执行React状态更新

时间:2020-05-21 21:51:53

标签: react-native react-hooks expo warnings use-state

在react-native应用程序中,出现此错误:

Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in %s.%s, a useEffect cleanup function

我看过一些与此问题类似的帖子,但是在使它们与我的问题联系起来时遇到了问题。

该应用程序没有损坏,只是收到了这个我真的很想修复的讨厌的警告。该警告提到使用useEffect清理功能,但当时我甚至没有在组件中使用useEffect,因此我决定添加一个,但没有帮助。

  useEffect( () => {

    if (action) {

      let controller = new AbortController();

      const loadData = async () => {
        try {
          const response = await fetch( action, { signal: controller.signal } );
          const data = await response.json();

          if ( data ) {
            setIdKey( data );
            setIsValid( true );
            setLoggedIn( true )
            setBadCreds( false );
            setAuthenticating( false );
            setHasLoggedIn( true );
            console.log('has logged in: ' + hasLoggedIn);
          } else {
            setContainerHeight( 20 );
            setBadCreds( true );
            setIsValid( true );
            setAuthenticating( false );
          }
        }
        catch ( error ) {
          setAuthenticating( false );
          if ( error.name == 'AbortError' ) {
            console.log( 'FetchCancel: caught cancel' );
          } else {
            console.log( error.message );
            throw error;
          }
        }
      };

      loadData();

      return () => {
        console.log( 'FetchCancel: unmounting' );
        controller.abort();
      }
    }

  }, [action] );

我一直在使用react钩子,对旧方法没有任何经验。

从技术上讲,该错误是从父组件报告的。

我明显缺少什么吗?

0 个答案:

没有答案