Question

我正在使用nextjs 9和redux。这是我的应用页面：

import React from 'react';
import { useRouter } from 'next/router';
import { ShowDataCmp } from '../../components';
import { getData } from '../../store/SamplePage/SamplePageAction';

const SamplePage = () => {
    const router = useRouter();
    return <ShowDataCmp query={router.query} />;
};

SamplePage.getInitialProps = async ({ store }) => {
    const config = {
        start_date: '1991-10-22',
        end_date: '2019-10-22',
    };
    await store.dispatch(
        getData(config),
    );
};

export default SamplePage;

我想获取一些数据，并dispatch an action来将数据存储在redux中。

然后我使用ShowDataCmp中的数据。我需要它在服务器端，这样数据才能出现在pageourse中，因此我必须在此处获取数据。但是因为我的提取API有点慢，所以页面加载确实很慢。

有什么解决方案可以补偿页面缓慢的加载时间？

Answer 1

尝试在_app页或layout组件中实现加载屏幕，并优化getData功能

使用getInitialProps时如何处理nextjs中的缓慢加载页面？

1 个答案: