Question

在componentWillMount()我调用fetch方法获取数据。但是当fetch未加载时。该组件为render。

如何修复它。如何在render（）

之前获取加载

Answer 1

你做不到。当您获取数据并为组件提供数据时，通常需要检查是否有数据。如果没有，则不渲染任何内容或呈现“无数据”之类的内容。或在那里展示一个旋转器。使用componentDidMount。

class App extends Component {
  state = {
    data: "",
  }

  componentDidMount() {
    this.fetchData();
  }

  fetchData() {
      fetch('https://jsonplaceholder.typicode.com/posts/1')
        .then(response => response.json())
        .then(json => this.setState( {data: json}));
  }

  render() {
    return (
      <div>
        { this.state.data ? <p>{this.state.data.title}</p>: "No data"}
      </div>
    );
  }
}

fetch，axios不能及时返回数据

1 个答案: