Когда и как перенаправить с помощью Apollo Client и React Router - PullRequest
Новая
       9

Когда и как перенаправить с помощью Apollo Client и React Router

0 голосов
/ 22 декабря 2018

l Я создал компонент React с использованием Apollo, и в настоящее время я использую функцию рендеринга для выполнения перенаправления после загрузки данных, но я получаю предупреждение: Warning: Cannot update during an existing state transition (such as within рендер ). Render methods should be a pure function of props and state.

Вот мой код: https://gist.github.com/jmn/c3f7c4489cd5f759808a62b48352ce87

Часть перенаправления: 

render() {
    return (
      <Query query={Q} variables={{ cursor: this.props.match.params.id }}>
      {({ loading, error, data, fetchMore }) => {
        if (loading) return <p>Loading...</p>;
        if (error) return <p>Error :(</p>;
        if (!this.props.match.params.id) {
          this.props.history.push(
            "/post/" + data.allPosts.pageInfo.endCursor
          );
        }
        return (
          <div></div>
        )

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

1 Ответ

0 голосов
/ 22 декабря 2018

Похоже, вы используете React Router v4, хотя я не совсем уверен.Как видно из React Router docs

история является изменяемой

, поэтому вызов this.props.history.push() вызывает вышеуказанную ошибку.Вместо того, чтобы поменять историческую опору, рассмотрите возможность использования компонента <Redirect /> следующим образом: 

if (!this.props.match.params.id) {
   return <Redirect to={"/post/" + data.allPosts.pageInfo.endCursor}
}

для получения дополнительной информации по <Redirect /> см. здесь

...