Блог

У меня есть статический файл JSON в моей общей папке, и я хочу вывести содержимое в компоненте React (NextJS). Просто снова отобразите все как JSON.

 import data from '../../public/static/somedata/data.json';

const DummyComponent = () => {
  return (
    <div className="box">{data}</div>
  );
};
 

В настоящее время я получаю ошибку:

Объекты недопустимы в качестве дочернего элемента React

Есть ли способ отобразить необработанное содержимое JSON в компоненте React?

Это должно сделать работу:

 <div className="box"><pre>{JSON.stringify(data, null, 2)}</pre></div>
 

Попробуйте JSON.stringify()

 import data from '../../public/static/somedata/data.json';

const DummyComponent = () => {
  return (
    <div className="box">{JSON.stringify(data)}</div>
  );
};