当api的加载变量为false时，React更新视图

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      apiLoaded: false
    };
  }

  componentDidMount() {
    // 在组件加载完成后，获取 API 数据
    // 设置 apiLoaded 为 true，以触发视图的更新
    fetchData().then(() => {
      this.setState({ apiLoaded: true });
    });
  }

  render() {
    return (
      <div>
        {this.state.apiLoaded ? <DataComponent /> : <LoadingComponent />}
      </div>
    );
  }
}

function MyComponent() {
  const [apiLoaded, setApiLoaded] = React.useState(false);

  React.useEffect(() => {
    // 在组件加载完成后，获取 API 数据
    // 设置 apiLoaded 为 true，以触发视图的更新
    fetchData().then(() => {
      setApiLoaded(true);
    });
  }, []);

  return (
    <div>
      {apiLoaded ? <DataComponent /> : <LoadingComponent />}
    </div>
  );
}