Question

当我获取数据时，我希望它们先获取然后渲染。即使我设置状态并且不明白原因，它也始终呈现空字符串。

<input>

当我在Feed组件中记录数据时，我首先看到一个空字符串，然后记录获取的数据。如何防止它呈现空字符串并等待首先获取数据然后呈现它？

Answer 1

在render内，检查posts的状态是否已填充。
如果没有，请显示加载屏幕或gif。

填充posts后，您将看到呈现的帖子。

render() {
  const {posts} = this.state;
  if (!posts || posts.length <= 0) {
    // Display a message or Show a Loading Gif here
    return <div>Loading...</div>
  }

    return (
      <div>
        <div className="nav">
          ...
        </div>

        <div className="main">
          {this.renderView()}
        </div>
      </div>
    );
  }

reactJS渲染空数据

1 个答案: