如何在渲染反应应用程序之前预加载数据

Question

我使用 React 位置库。想要从 cookie 中获取令牌（如果存在）然后将其发送到服务器以检查它是否处于活动状态。我的问题是无论路由如何，我如何才能在渲染应用程序之前执行一次此操作？

我试过类似的方法，但它仅适用于特定路线

    {
        path: '/',
        element: () => import('../pages/Main').then(mod => <mod.default />),
        loader: async () => {
            return {
                user: await fetchResource('user', {}, true)
            };
        }
    },

Answer 1

在 App.js 你可以做这样的事情

const [ready, setReady] = useState(false);
useEffect(()=>{
  // fetch your token and verify
  setReady(true)
  },[]);

return (
  {
    ready ? (
      // Your app components here
    ) : (
       <div> Loading .... </div>
    )
  }
)

如何在渲染反应应用程序之前预加载数据

How to preload data before rendering react app

preloading

reactjs

react-location