Как правильно связать location.search и state?

Question

[Maksim B]

Скажем есть строка поиска с кнопкой Найти, если ее кликнуть я делаю history.push('/search?q=' + this.state.search)
А как теперь отследить и обработать переход Назад, чтобы qs.parse(location.search).q снова переходил в состояние?

Главное условие, this.state.search должен быть именно в query части url.

Answer 1

[Максим]

Можно взять react-router, и у компонента, при изменении props, в момент componentWillReceiveProps (getDerivedStateFromProps) устанавливать новое состояние. Хотя тут в состояние то писать в целом необязательно, так как у вас строка URL адреса и есть состояние. Оно актуальное, незачем дублировать.

Если без react-router'a, то посмотрите в этом туториале пункт "обучаем Router реагировать на изменение адреса" (там не react-router, а просто сделанный компонент Router)

Кнопка "назад" работает, если использовать browserHistory / hashHistory из коробки.