首页 > 解决方案 > getServerSideProps 未填充状态

问题描述

我正在尝试在我的 index.js 页面中使用 getServerSideProps 填充应用程序状态,这是文件的内容:

import Navbar from "../components/Layouts/Navbar";
import MainBanner from "../components/Layouts/MainBanner";
import Footer from "../components/Layouts/Footer";

import { loadContent } from "../store/appSlice";
import { wrapper } from "../store/store";

const Index = () => {
    return (
        <>
            <Navbar />

            <MainBanner />

            <Footer />
        </>
    );
};

export const getServerSideProps = wrapper.getServerSideProps(store => async ({ req }) => {
    await store.dispatch(loadContent());
});

export default Index;

如果 loadContent 看起来像这样:

const loadContent = () => async dispatch => {
    dispatch(contentRequested());
    return fetchContent()
        .then(data => {
            console.log(data);
            dispatch(serviceSuccess(data.services));
            dispatch(testimonySuccess(data.testimonials));

            return dispatch(contentSuccess(data));
        })
        .catch(error => {
            return dispatch(contentError(error));
        });
};

在 console.log 中,正在检索数据,但接下来的 2 个调度不会填充状态。有什么建议么?

谢谢!

标签: react-reduxnext.jsredux-toolkit

解决方案


推荐阅读