Как получить данные из локальных данных с помощью JS - PullRequest
Новая
       3

Как получить данные из локальных данных с помощью JS

0 голосов
/ 07 февраля 2020

У меня есть файл данных. js в моем локальном файле, и я хочу показать свои данные в консоли. Я пытался с fetch не получить никаких данных. Вот мои данные. js файл. 

var TABLE_DATA = [
  {
    id: "5",
    name: "cony #5",
    thumbnailUrl: "image/5.gif",
    price: 170
  },
  {
    id: "1",
    name: "cony #1",
    thumbnailUrl: "image/1.gif",
    price: 170
  },
  {
    id: "2",
    name: "cony #2",
    thumbnailUrl: "image/2.gif",
    price: 270
  },
  {
    id: "8",
    name: "cony #8",
    thumbnailUrl: "image/8.gif",
    price: 70
  },
  ]

Я пробовал с приведенным ниже кодом, но не работал. 

window.addEventListener("load", getTableData);

function getTableData() {
  fetch("json/data.js")
  .then(res => {
    console.log(res);
  });
}

Тогда я попробовал с топором ios. С топором ios данные отображаются, но отображаются полные данные с именем переменной. 

window.addEventListener("load", getTableData);

function getTableData() {
  axios.get("json/data.js")
  .then(res => {
    console.log(res.data);
  });
}

Ниже приведен фрагмент данных, отображаемых в консоли. 

var TABLE_DATA = [
  {
    id: "5",
    name: "cony #5",
    thumbnailUrl: "image/5.gif",
    price: 170
  },
  {
    id: "1",
    name: "cony #1",
    thumbnailUrl: "image/1.gif",
    price: 170
  },
  {
    id: "2",
    name: "cony #2",
    thumbnailUrl: "image/2.gif",
    price: 270
  },
  {
    id: "8",
    name: "cony #8",
    thumbnailUrl: "image/8.gif",
    price: 70
  },
  ]

Теперь, как я могу получить данные с топором ios или без топора ios?

Это data. js file https://api-learning.netlify.com/json/data.js

Вот мое демо в браузере и проверьте консоль https://api-learning.netlify.com/

1 Ответ

1 голос
/ 07 февраля 2020

Воу, подожди минутку. Если вы храните данные, вы не хотите использовать обычный старый файл JavaScript. Вместо этого поместите ваши данные в файл JSON.

data.json

[
  {
    "id": "5",
    "name": "cony #5",
    "thumbnailUrl": "image/5.gif",
    "price": 170
  },
  {
    "id": "1",
    "name": "cony #1",
    "thumbnailUrl": "image/1.gif",
    "price": 170
  },
  {
    "id": "2",
    "name": "cony #2",
    "thumbnailUrl": "image/2.gif",
    "price": 270
  },
  {
    "id": "8",
    "name": "cony #8",
    "thumbnailUrl": "image/8.gif",
    "price": 70
  }
]

Обратите внимание, что ключи теперь заключены в двойные кавычки. Это важно .

Существует целый ряд способов загрузки JSON данных в файл JavaScript, но это в значительной степени зависит от того, в какой среде вы работаете:

  • В Node это просто модуль require.
  • В jQuery, вызов функции $.getJSON().
  • Помимо них, Fetch API и Ax ios может работать, но я уверен, что есть и другие варианты.

Найдите минутку, чтобы ознакомиться с JSON, и выясните, какой способ его загрузки лучше всего подходит для вас. .

...