Question

我是React的新手，我正在尝试创建一个博客。出于搜索引擎优化的原因，我正在使用react-router，react-helmet，react-snapshot和静态服务器来查看Snapshot如何呈现代码。快照呈现页面，当我观察源代码时出现问题：快照仅呈现预加载的代码。正如您在下一个代码中看到的那样，我会在加载帖子列表之前显示加载文本。

render() {
if (this.state.loaded) {
  let posts = this.state.posts;

  return (
    <div>
      {posts.map((post) => {
        return (
          <div key={post.slug}>
            <Link to={`/post/${post.slug}`}>{post.title}</Link>
          </div>
        )
      })}
    </div>
  );
} else {
  return (
    <div>
      Loading...
    </div>
  )
}

这是用户看到的： This is what te users see

这就是谷歌所看到的：

<div data-reactid="4">
    <div data-reactid="5">Loading...</div>
</div>

是否有渲染所有内容的解决方案？

谢谢，

Answer 1

我建议在React Snapshot上打开一个问题 - 我依旧记得在拍摄快照时允许更长时间超时的讨论，因此可以捕获你的帖子。 https://github.com/geelen/react-snapshot/issues

如何使用React Snapshot呈现所有内容？

1 个答案: