Получение Json -данных из выборки

Question

my Json -файл - это простой объект с двумя массивами:

{ 
"key1": ["a", "b", "c"],
"key2": [ "d", "e", "f"] 
}

в Javascript Я использую fetch для получения данных. Чтобы использовать данные, я помещаю их в массив

const jsonData = '/things.json';
const myArray = [];

fetch(jsonData)
.then(answer => answer.json())
.then(data => myArray.push(data))

console.log(myArray); //this gives me a nested array

console.log(myArray[0]); //undefined 

, помещая myArray через al oop, также я получаю // undefined

с использованием синтаксиса распространения или concat дает мне / / Найден невызываемый @@ итератор

Как я могу получить содержимое этого массива?

Answer 1

Как указано @Gavin, ваш оператор console.log должен выполняться после завершения fetch. Один из способов сделать это - добавить это в другой then.

fetch(jsonData)
.then(answer => answer.json())
.then(data => myArray.push(data))
.then(() => console.log(myArray[0]));

Вывод:

Answer 2

После получения данных JSON Просто введите const array=Object.values(jsonData)

Я имел в виду

fetch(location).then((response)=>{
response.json().then((data)=>{
const array=Object.values(data)

Answer 3

Что вам нужно сделать, так это:

const jsonData = '/things.json';
const myArray = [];

fetch(jsonData)
.then(answer => answer.json())
.then(data => myArray.push(...data)) //Notice the spread operator

UPDATE Похоже, что оператор распространения не работает в вашем проекте, вы тоже можете сделать это:

const jsonData = '/things.json';
const myArray = [];

fetch(jsonData)
.then(answer => answer.json())
.then(data => myArray = data);

Для того, чтобы ... не работал над вашими проектами, могут быть различные решения, одно из которых - изменение target в tsconfig на "target": "es5"