Как визуализировать следующий компонент только после успешного получения данных? - PullRequest
Новая
       28

Как визуализировать следующий компонент только после успешного получения данных?

0 голосов
/ 05 августа 2020

В настоящее время я знакомлюсь с извлечением флагов и отображением полос загрузки, и я успешно могу запустить индикатор загрузки с помощью флага выборки. Однако сейчас я хочу реализовать то, что новая страница отображается только в том случае, если данные были успешно получены. Пока данные извлекаются, пользователь остается на предыдущей странице и отображается полоса загрузки. отображается: Отображение новой страницы

Таким образом, на сайте не появляется сообщение «Идет загрузка».

Мой компонент для получения историй и отображения некоторого индикатора загрузки во время выборки: 

export class Story extends Component {

     componentDidMount() {
    this.props.getStory();
  }
  
  render() {
    const { story, isFetching } = this.props.story;

    const isLoaded =  (
     
     story.title

    )

    const isLoading  = (

       <h3>Loading...</h3>
      )

    return (

  <Fragment>

        <h2>Stories</h2>

        {!isFetching?  <div> isLoaded</div>  : <div>isLoading </div>}

      </Fragment>

    );
  }
}

function mapStateToProps(state, ownProps) {
    const story = state.story
  return { story}
};

export default connect(
  mapStateToProps,
  { getStory}
)(Story);

Я, однако, не совсем понимаю, как реализовать этот logi c, и не могу найти доступ к этой проблеме. Например, вопрос в том, где разместить лог c проверки готовности данных. В предыдущем компоненте или в том, который будет отображаться?

Я рад любым подсказкам по этому поводу.

...