Задать вопрос
@rinatoptimus
react

Почему не рендерится компонент в React router v4?

В разделе Categories есть несколько пунктов: Shoes, Boots и тд. У них рендеринг HTML-элементов прописан прямо в теге . Вот так:
<Route path={`${match.path}/:name`} render={
  ({ match }) => (<div><h3> {match.params.name} </h3></div>)
} />

Решил создать пункт, нажимая на который будет отрисовываться отдельный компонент One:
<Route path="/one" component={One} />
Не работает, ошибок нет.
Вот ссылка.

UPDATE: поправил, но теперь в адресной строке дважды прописывается "category".
  • Вопрос задан
  • 447 просмотров
Комментировать
Подписаться 1 Простой Комментировать
Решение пользователя rinatoptimus К ответам на вопрос (2)
@rinatoptimus Автор вопроса
Методом тыка настроил таким образом:
<ul>
        <li><Link to={`${match.url}/shoes`}>Shoes</Link></li>
        <li><Link to={`${match.url}/boots`}>Boots</Link></li>
        <li><Link to={`${match.url}/footwear`}>Footwear</Link></li>
        <li><Link to={`${match.url}/hats`}>Hats</Link></li>

        <li>
          <Link to={`${match.path}/one`}>One</Link>
        </li>
      </ul>
      <Switch>
      <Route path={`${match.path}/:name`} render={
        ({ match }) => (<div><h3> {match.params.name} </h3></div>)
      } />
      <Route path={`${match.path}/one`} render={
          ({ match }) => ({ One })
      } />
      </Switch>

Не знаю, может быть, это костыль, но работает.
Ответ написан
Комментировать
Комментировать