如何在SPA中正确地暂停反应路由过程



有一个网站,前面是ReactJS写的。为了CEO的正确操作,使用了SSR。算法类似于:

1页加载

  1. 浏览器打开/foo
  2. SSR检查是否在缓存中/foo没有找到它
  3. SSR在服务器上呈现并在request/foo上执行react应用程序
  4. SSR将HTML放入缓存中,结果是render process/foo
  5. SSR为浏览器提供了一个HTMLL,这是渲染过程/foo的结果
  6. 浏览器执行异步请求,这些请求是HTML,这是/foo渲染的结果(CSS、JS、favicon…(
  7. 加载的应用程序react"了解页面已经绘制,不需要执行路由等">
  8. react处理用户的进一步操作(如在常规SPA中(

后续更新

  1. 浏览器打开/foo
  2. SSR检查是否在缓存中/foo没有找到它
  3. SSR在服务器上呈现并在request/foo上执行react应用程序
  4. SSR将HTML放入缓存中,结果是render process/foo
  5. 给浏览器一个HTMLL,这是渲染过程/foo的结果
  6. 浏览器执行异步请求,这些请求是HTML,这是/foo渲染的结果(CSS、JS、favicon…(
  7. 加载的应用程序react"了解页面已经绘制,不需要执行路由等">

react处理用户的进一步操作(如在常规SPA中(。问题是,每次刷新页面时,都会启动路由,重新绘制整个应用程序,从而出现"闪烁",即第7点不起作用。

问题:是否可以在某个时刻停止此渲染?告诉路线现在没有必要画。也许有什么流行的解决方案?

您可以使用生命周期方法shouldComponentUpdate。您可以在方法中为要重新渲染或不渲染的组件设置自己的逻辑。shouldComponentUpdate类方法在运行组件的重新呈现之前可以访问下一个道具和状态。在这里,您可以决定通过从该方法返回false来防止重新渲染。如果返回true,则组件将重新渲染。

最新更新