Как получить данные JSON, используя fetch в реакции - PullRequest
0 голосов
/ 23 сентября 2019

Я использую реагирование и работаю над получением файлов json в компоненте.

Я хочу получить файл input.json с помощью fetch, но это не данные в консоли.Почему это так и как мне получить данные?

input.json

{
    "formId": 1,
    "title": "from",
    "items": [{
      "itemId": 1,
      "title": "style",
      "formType": 1,
      "options": [{
        "id": 1,
        "text": "one"
      }, {
        "id": 2,
        "text": "two"
      }, {
        "id": 3,
        "text": "three"
      }]
    }

App.js

import React from 'react';
import './App.css';
import inputData from './assets/input.json';

function App() {

  const getData = () => {
    fetch(inputData).then(response => {
               return response;
             }).then(data => {
               console.log(data);
             }).catch(err => {
               console.log(err)
             });
  }

  getData();

  return (
    <div className="App">
      <h2>Fetch</h2>
    </div>
  );
}

export default App;

console.log enter image description here

Ответы [ 3 ]

1 голос
/ 23 сентября 2019

Попробуйте,

import React from 'react';
import './App.css';
import inputData from './assets/input.json';

function App() {

  const getData = () => {
    fetch(inputData).then(response => {
                console.log(response);
                console.log(response.data);
              }) catch (err => console.log("err",err))
  }

  getData();

  return (
    <div className="App">
      <h2>Fetch</h2>
    </div>
  );
}

export default App;
0 голосов
/ 23 сентября 2019

Вы пробовали с анализом ответа в формате json?

что-то вроде этого:


import inputData from '../assets/input';

const getData = () => {
 fetch(inputData).then(response => {
const result = response.json()
            return result;
          }).then(data => {
            console.log(data);
          }).catch(err => {
            console.log(err)
          });
}
0 голосов
/ 23 сентября 2019

вы что-то упускаете в результатах поиска, это должно быть

 fetch(inputData).then(response => {
            response.json().then(data => {
            console.log(data);
          }).catch(err => {
            console.log(err)
          });


...