Почему у нас не должно быть browserHistory.push ('/ some-path') в методе render ()? - PullRequest
0 голосов
/ 02 ноября 2018

Ниже мой код

class LoginContainer extends Component {
  ...
  render() {
    return <LoginApp  isAuthenticated={this.props.isAuthenticated} />
  }
}

/* ==> Implemetation of LoginApp is like below <== */

import { browserHistory } from 'react-router';
class LoginApp extends Component {
  ...
  render() {
    if (this.props.isAuthenticated) {
      browserHistory.push('/dashboard');
      return null;
    }
    /* code to render login form elements....*/
  }
}

Этот код выдает предупреждение, как показано ниже, когда значение true передается как значение isAuthenticated в LoginApp

Предупреждение: setState (...): Невозможно обновить во время существующего перехода состояния (например, в рамках визуализации или конструктора другого компонента). Методы рендеринга должны быть чистой функцией реквизита и состояния; побочные эффекты конструктора - это не шаблон, но их можно переместить в componentWillMount.

На данный момент не могу вносить какие-либо изменения в компонент LoginApp, поэтому сделал небольшой обходной путь в LoginContainer (который мне действительно не понравился)

Изменения, которые я внес,

  1. Невозможно передать значение isAuthenticated компоненту LoginApp.
  2. Переадресация с самого компонента контейнера через компонент смонтировала и обновила

Новая реализация LoginContainer, как показано ниже

class LoginContainer extends Component {
    ...
  componentDidMount() {
    if (this.props.isAuthenticated) {
      browserHistory.push(prependAppRoute('/'))
    }
  }

  componentDidUpdate() {
    if (this.props.isAuthenticated) {
      browserHistory.push(prependAppRoute('/'))
    }
  }
  render() {
    return <LoginApp />
  }
}

А теперь у меня нет этого предупреждения, и я нахожусь в режиме - мой код работает (так как предупреждений нет), но я не знаю, почему ? ??

Реактивная версия: 15 Версия React-роутера: 2.8.1

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...