React как сделать переход на карточку товара в интернет магазине

Question

Подскажите пожалуйста как при клике на карточку товара сделать на нее переход. Карточки создаются динамически

{filteredCard.slice(0, this.state.visiable).map((item) => (
        <div className="card" key={shortid.generate()}>
         ......
        </div>
           )};

Данные беру с json. В карточке есть кнопка подробнее. По клику как отрендерить ее? Подскажите пожалуйста) В какую сторону двигаться мне

Answer 1

Для того что бы переходить на каждую уникальную карточку, в твоем случае тебе нужно использовать 'react-router-dom'.

{filteredCard.slice(0, this.state.visiable).map((item) => (
    <div className="card" key={shortid.generate()}>
      <NavLink to={'/название url/' + item.id}>{item.имя}</NavLink>
    </div>
       )};

В App Js:

<Route path="/название url/:id" render={() => Здесь компонента твоей карточки} />

В самой компоненте получаешь props и используешь то что тебе нужно.

Вот более детальное объяснение перейти по ссылке

БЛОГ НА HUSL

React как сделать переход на карточку товара в интернет магазине

Ответы (1 шт):