Как вывести товары из json в React?

Question

[Вадим Семенников]

Всем привет! подскажите, пожвлуйста как реализовать такое: Каталог всех товаров, должен браться из json-файла
Спасибо

Answer 1

[Антон Спирин]

Например так:

import React from 'react';
import data from './products.json';

const List = () => (
  <ul>
    {data.map(product => (
      <li key={product.id}>{product.title}</li>
    )}
  </ul>
);

Списки и ключи

Comments

[Вадим Семенников]

Подскажите, пожалуйста в какой директории правильнее хранить json пакет данных

[WapSter]

Вадим Семенников, правильнее их запрашивать со стороны бекенда

[Вадим Семенников]

Тимур Турсунбаев, дайте, пожалуйста пример. Не понимаю.
Надо отправлять аякс запрос? Но как мне это реализовать если я делаю апликацию при помощи create-react-app?

[WapSter]

Вадим Семенников, извиняюсь с реактом никак не взаимодействую может там фитча какая-то есть. Но обычно люди пользуются axios или fetch. И это довольно легко гуглиться. Но раз уж вы задаёте данный вопрос, лучше вам подучить es6 прежде чем лезть к фреймворкам. И желательно знать как работает вебпак, зачем он нужен вообще, что такое лоадеры, плагины да и масса чего ещё, чтобы более или менее его понять убьете дня 3, но потом будет меньше вопросов, и будет представление, что вам нужно искать.
UPD Если бекенда никакого нет можно его эмулировать при помощи это сервиса https://jsonplaceholder.typicode.com/ там кстати, есть примеры отправки запроса