确保 useState（） 钩子已经由 useEffect hook 更新？

Question

我重构了我的代码以使用useEffect钩子而不是使用class，但是我在刷新结果时遇到了内存泄漏。我确实使用了useEffect，但我仍然收到一条错误消息，不确定我在代码中哪里犯了错误。

我收到以下错误：

警告：来自 useState（） 和 useReducer（） Hooks 的状态更新不支持第二个回调参数。要在渲染后执行副作用，请使用 useEffect（） 在组件主体中声明它。

      import React, { useEffect, useState} from 'react';

      import { FlatList, View, TouchableHighlight } from 'react-native';

      import { USANews } from '../components/fetchNews';

      import Article from '../components/Article';

      const  homeScreen = ({ handleRefresh, navigation, }) => {

        const [state, setState] = useState({articles: [], refreshing: true});

        useEffect (() => {

          fetchNews();

        }, )

        const fetchNews = () => {

          USANews() .then(articles => {

              setState({ articles, refreshing: false });

            })

            .catch(() => setState({ refreshing: false }));

        };

        handleRefresh = () => {

          setState({ refreshing: true }, () => fetchNews());

        };

          return (

            <View style={{backgroundColor: '#fffafa'}}>

            <FlatList

              data={state.articles}

              keyExtractor={item => item.url}

              refreshing={state.refreshing}

              onRefresh={handleRefresh}

              renderItem ={({item}) => {

                return (

                <TouchableHighlight onPress={() => navigation.navigate('Detail', 

                {title: item.title, description: item.description, urlToImage: item.urlToImage})}

                >

                <Article article={item} />

                </TouchableHighlight>

                );

            }} 

            />

          </View>

          );

      }

      export default homeScreen;

Answer 1

从 中删除 中的额外参数。setState({ refreshing: true }, () => fetchNews())handleRefresh也许还可以添加到效果中的依赖项数组中，以便它仅在更新时运行，除非您希望在组件呈现的任何时候进行提取。statestate