Vue.js； 如何使用 Axios 获取本地 JSON 文件？

Question

I'm wondering how I wonder how I can read a local JSON file using Axios?` The data.json file is located in public/info/data.json? 每次我尝试执行获取请求时，都会收到 404 消息

Data.json looks like this:
[
{"id": 1239,"name": "Card 1"},
{"id": 1235,"name": "Card 2"},
{"id": 1233,"name": "Card 3"},
{"id": 1233,"name": "Card 4"},

]

Get method looks like this: 
  created() {
  axios.get("../../public/data/data.json")
  .then((response) => {
      response.data
  })

Answer 1

如果它在本地，则无法通过 Axios 使用路径获取它。 您可以直接导入本地文件

import jsondata from '../your-data.json'

Axios 只能做网络请求，所以如果你的 json 路径在/public/data.json 。 你可以这样请求

const response = await axios('http://localhost:3000/public/data.json')

Answer 2

You can put your json into project's public static directory, your json file locates at ~project/public/data/data.json , request like this

axios.get("/data/data.json", {
    baseURL: "/",
  })