用umi做服务端渲染发现其没有将服务端初始化数据同步到客户端

最新推荐文章于 2023-12-27 17:10:06 发布

supming1

最新推荐文章于 2023-12-27 17:10:06 发布

阅读量858

点赞数

分类专栏： umijs

本文链接：https://blog.csdn.net/supming1/article/details/109549352

版权

umijs 专栏收录该内容

9 篇文章 1 订阅

订阅专栏

react服务端渲染一般来说会将初始化model数据保存到给一个全局量中，待客户端接管的时候，用改全局变量中的数据进行初始化到客户端model中。最近用umi做服务端渲染，发现服务端调用dispatch保存到model中的数据没有渲染到客户端全局变量中；在getInitialProps 直接返回的值，会保存到客户端全局变量中，但是没有拿改变量初始化到model中。所以用umi做服务端渲染，没有办法将服务端model同步到客户端。下面是渲染出来的代码，去除了部分重要代码。


<!DOCTYPE html><html><head><title data-react-helmet="true"></title>
    <meta charset="utf-8">
   
    <link rel="stylesheet" href="/umi.css">
    <script>
      window.routerBase = "/";
    </script>
    <script src="/devScripts.js"></script>
    <script>
      //! umi version: 3.2.22
    </script>
  </head>
  <body>
    <div id="root"><section class="container___erFot"><div><div>ming</div></div></section></div>
	<script>
  window.g_useSSR = true;
  window.g_initialProps = {"productInfo:{"activity_id":20,"group_id":"1322058388049248256"}],"join_info":{"uid":0,"join_status":0}}};
	

    <script src="/umi.js"></script>
  

</body></html>

从渲染出来的结果可以看出数据保存在window.g_initialProps 中，但并没有用他做初始化，同步到model中。

这在一些需要刷新页面的场景中会很尴尬，用model保存，没办法同步；直接在getInitialProps中返回由没法修改；放在页面state中在保存一份，切换页面getInitialProps变成客户端渲染的时候，又可能比componentDidMount执行的慢导致出问题。