Визуализация одного и того же компонента с некоторыми изменениями свойств состояния при изменении определенного маршрута

Как я могу внести изменения в некоторое свойство состояния компонента на основе маршрута. Итак, на данный момент у меня есть компонент, в котором я определил свойство состояния showNotebook= true.

   super(props);
      this.state = {
        showNotebook: true,
        flipper: true,
        deleteModalOpen: false
      }

И я использую реактивный маршрутизатор, где у меня есть такой маршрут

<Route path='/submission/:id' component={SubmissionContainer}/>

Так что теперь я хочу, чтобы если кто-то идет по маршруту

 /submission/:id#comment.id=xyzz

Он должен отображать тот же компонент, что и выше, но со свойством showNotebook, установленным в false, так что это тот же компонент с необходимыми изменениями.

Я знаю, что здесь уже задавали подобные вопросы, но не смог найти точное решение моей проблемы. Так что заранее извиняюсь за это.


reactjs react-router-dom react-router react-router-v4
person Aman_Kawatra    schedule 16.04.2018    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Вы можете просто проверить путь к местоположению из реквизитов маршрутизатора и существует ли параметр запроса id, а затем установить состояние с помощью некоторой логики, например:

this.state = {
  showNotebook: () => {
    if (this.props.location.pathname === '/submission' && this.props.location.search)
      return false;
    return true;
  }
  ...
}
person m-ketan    schedule 16.04.2018
comment
Пробовал, но это дало мне: Uncaught TypeError: невозможно прочитать свойство «путь» неопределенного - person Aman_Kawatra; 16.04.2018
comment
Вам нужно будет использовать библиотеку react-router-dom, чтобы иметь возможность делать все это. - person m-ketan; 16.04.2018