2016-12-02 2 views
0

Итак, у меня есть главная страница, на которой представлено множество предметов. Я стараюсь сделать каждый элемент кликабельным, что приведет вас к странице товара. Предостережение есть много вещей (думаю, десятки тысяч), поэтому я не собираюсь жестко кодировать новую страницу для каждого; страница должна быть автоматически сгенерирована из данных элемента (передана с главной страницы или получена из БД, на самом деле не имеет значения).ReactJS; перейти к «динамической» новой странице с данными?

Если предметы были книгами, я бы хотел, чтобы это выглядело примерно так; website.com/book/ReactJS For Dummies. Теперь книги могут иметь разные версии, которые влияют на то, какие данные отображаются на странице, поэтому мне нужно передать дополнительный параметр; что-то вроде website.com/book/ReactJS For Dummies?edition=First_Edition.

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

ответ

0

Видимо то, что я искал был React-маршрутизатора путь реквизита, поскольку следующим образом:

<Router history={browserHistory}> 
    <Route path="/" component={App}/> 
    <Route path="/book/:bookName/:bookEdition" component={Book}/> 
</Router> 

Тогда я могу обернуть любой компонент в Link:

<Link to={"/book/ReactJS For Dummies/1st Edition"}><p>Link here</p></Link> 

И в Book компоненте я могу получить доступ к этим реквизита через this.props.params.bookName и this.props.params.bookEdition. Довольно изящный.

0

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

website.com/book/1 в React для чайников 1-е издание, а затем

website.com/book/2 в React для чайников 2-е издание

Passing идентификатор в качестве параметра будет гораздо проще, чем книги имен с другими запросами прикрепленными

+0

Я рассматривал это как вариант, но для моего конкретного дизайна лучше иметь URL-адрес, содержащий информацию о книге в текстовом виде. – IronWaffleMan

Смежные вопросы