reactjs - API 使用 React Redux Hooks Saga 重复调用？

Question

我将 redux hooks saga 与 API 集成，我想加载项目一次并监听更改，API 不断被调用：

import { loadProjects } from '../../store/actions';

useEffect(() => {
    props.loadProjects();
}, []);


return (<React.Fragment>...</React.Fragment>)

const mapStatetoProps = state => state.Projects;

export default connect( mapStatetoProps, { loadProjects })(InvoicesList);

这导致无限循环，从 API 加载数据 -> 更新存储 -> 呈现更改 -> 再次加载数据 -> ...

一次加载项目的解决方案是什么，我是在渲染之前调用还是在减速器初始状态下调用？或者这是使用钩子时的正常现象。

export const loadProjects = () => ({
    type: PROJECTS_LIST,
    payload: {}
});

这个片段在 index.js -> App.js -> project.js 里面

import store from './store';

const app = (
    <Provider store={store}>
        <BrowserRouter>
            <App />
        </BrowserRouter>
    </Provider>
);

ReactDOM.render(app, document.getElementById('root'));
serviceWorker.unregister();

这是 App.js 代码

return (
                <React.Fragment>
                <Router>
                    <Switch>
                    

                        {userRoutes.map((route, idx) => (
                            <Authmiddleware
                                path={route.path}
                                layout={Layout}
                                component={route.component}
                                key={idx}
                            />
                        ))}

                    </Switch>
                </Router>
            </React.Fragment>
        
          );
        }

const mapStateToProps = state => {
    return {
        layout: state.Layout
    };
};

export default connect(mapStateToProps, null)(App);

标签： reactjsapireduxreact-hookssaga