Блог

Главная - Вопросы по программированию - Получить идентификатор URL в react

Получить идентификатор URL в react

#reactjs

#reactjs

Вопрос:

Привет, у меня вопрос, как мы можем перехватить id из url 

  onProductClick = item => {
    this.props.history.push(`/product/${item.id}`);
  };

Как мы можем присвоить это поступление переменной id из url в react

Это то место, где я планировал перехватить оценщик идентификаторов 

 class ProductView extends React.Component {
 componentDidMount() {
let someVar = this.props.location.pathname.split('/').pop()
console.log('router val ', someVar);}

Комментарии:

1. Пожалуйста, уточните, что это за идентификатор, который вы пытаетесь передать, и откуда он должен исходить?.. Что вы подразумеваете под идентификатором URL?

2. @S.Haviv Это примерно так localhost: 3000 / product / 12 , на странице продукта, как я могу получить идентификатор (12)

3. Похоже, вы используете react-router, я думаю, вам следует упомянуть это в вашем вопросе. Так является ли id запросом или параметром пути? И, в частности, в чем заключается ваш вопрос. Хотели бы вы прочитать item.id опять какое-то другое место в вашем коде?

4. Я не вижу его, это сервер разработки только для вас локально.

5. @the_cheff Это как этот localhost: 3000 / product / 12, на странице продукта, как я могу получить идентификатор (12)

Ответ №1:

Похоже, что вы используете react-router, маршрут, в котором вы хотите получить идентификатор, должен быть добавлен при объявлении маршрутов, подобных этому. > path=»/product/:id» Это должно быть сделано там, где вы указываете свои маршруты и маршрутизируете определенный компонент.

Внутри маршрутизируемого компонента who найдет идентификатор в реквизитах в основном с этим значением. this.props.match.params.id

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