useEffect() 导致重新渲染和对 api 的多个请求
useEffect() cause re-renders and multiple requests to api
问题
功能组件导致多次重新呈现,从而导致多个 ajax 请求。解决方案是什么?
这是我的代码。
export default function MyMenu() {
let menu = useStoreState(state => state.menu.menu);
const getMenu = useStoreActions(actions => actions.menu.getMenu);
let categoryId = useStoreState(state => state);
const setCategoryId = useStoreActions(actions => actions.menu.setCategoryId);
const [localCategoryId, setLocalCategoryId] = React.useState(0);
React.useEffect(() => {
getMenu();
});
// below is usual return method
}
您应该将一组依赖项作为第二个参数传递给 useEffect
。如果你只需要 运行 一次 - 传递一个空数组,像这样:
React.useEffect(() => {
getMenu();
}, []);
缺少第二个参数[]
,看一下:
React.useEffect(() => {
getMenu();
}, []);
问题
功能组件导致多次重新呈现,从而导致多个 ajax 请求。解决方案是什么?
这是我的代码。
export default function MyMenu() {
let menu = useStoreState(state => state.menu.menu);
const getMenu = useStoreActions(actions => actions.menu.getMenu);
let categoryId = useStoreState(state => state);
const setCategoryId = useStoreActions(actions => actions.menu.setCategoryId);
const [localCategoryId, setLocalCategoryId] = React.useState(0);
React.useEffect(() => {
getMenu();
});
// below is usual return method
}
您应该将一组依赖项作为第二个参数传递给 useEffect
。如果你只需要 运行 一次 - 传递一个空数组,像这样:
React.useEffect(() => {
getMenu();
}, []);
缺少第二个参数[]
,看一下:
React.useEffect(() => {
getMenu();
}, []);