React每次都会重新渲染所有内容

Question

告诉我我做错了。.

无论我尝试什么，都行不通。

我试图做的是创建一个具有独立子组件的组件，该子组件可以自我管理，并防止不必要的渲染。 但是每次子组件状态更改时，整个App都会重新呈现。

请帮助，我迷路了。

const areEqual = (prevProps, nextProps) => true;

const App = React.memo(() => {
    const [globalState, globalActions] = useGlobal();


    useEffect( () => {
        async function fetchData() {
            window.dispatchEvent(new CustomEvent("SpinnerEvent", {detail: true}));
            globalActions.populateFieldOptions();
            await globalActions.setWorkOrderList('A0', 0);
            await globalActions.describeEditableFields();
        }
        if(!globalState.doneLoading) fetchData();
    }, []);


    return <div className="App">
         <IconSettings {...svgAssets}>
            <Loader/>
            <div style={{display: 'flex', flexDirection: 'column', height: '100%'}}>
                <PageHeaderWrapper/>
                <div style={{position: 'relative', height: 'inherit'}}>
                    <FilterWrapper/>
                    <TableWrapper/>
                </div>
            </div>
        </IconSettings>
    </div>;
}, areEqual);