Маршрутизатор REACT не может получить доступ к параметрам при использовании render()

Я новичок в редуксе, я создал маршрут для перехода на страницу редактирования пользователя, а также хочу передать хранилище и историю в качестве реквизита, используя приведенный ниже код.

<Route path="/edit/:id" render={({history}) => (
          <EditUser store={store} history={history} />
)}/>

Но теперь я не могу получить доступ к параметрам, которые я передаю (:id) в моем компоненте EditUser. Когда я пытаюсь получить доступ, используя this.props.match.params.id, он показывает undefined, но он работает, если я переписываю свой маршрут на

<Route path="/edit/:id" component={EditUser}/>

Но теперь я думаю, что я не могу передать другие реквизиты.

Помощь очень ценится.


reactjs react-props react-router react-router-v4
person Arun    schedule 17.11.2017    source источник
comment
какой <Route> вы используете <BrowserRouter> , поделитесь своим index.js?   -  person Aaqib    schedule 17.11.2017
comment
да, я использую ‹BrowserRouter› в своем index.js   -  person Arun    schedule 17.11.2017

Ответы (1)


arrow_upward
5
arrow_downward

Если вы хотите использовать match, вы должны передать его своему компоненту.

<Route path="/edit/:id" render={({history, match}) => (
  <EditUser store={store} history={history} match={match} />
)}/>

Вы также можете просто передать все реквизиты:

<Route path="/edit/:id" render={props => (
  <EditUser store={store} {...props} />
)}/>

Или вы можете использовать функцию connect react-redux, чтобы получить доступ к хранилищу.

<Route path="/edit/:id" component={connect(mapStateToProps)(EditUser)}/>
person azium    schedule 17.11.2017
comment
Спасибо за этот потрясающий ответ с несколькими способами подключения реактивного маршрутизатора к реактивному редуксу. Я не могу поверить, что это не более очевидно в документах... - person Julian Soro; 18.11.2017