使用 axios.get 从静态目录加载 json 文件答案

【问题标题】：loading json files with axios.get from static directory使用 axios.get 从静态目录加载 json 文件
【发布时间】：2020-09-13 21:13:42
【问题描述】：

在我的 vue.js 应用程序中，我一直在从我在 nuxt.config.js 中配置为 baseURL 的 API 加载所有数据。现在我想加载一个不是来自那个 API 的静态 json 文件。该文件将包含要根据用户交互加载的其他文件名称。为了保持我的代码一致，我想使用 axios.get 以与 API 调用相同的方式加载静态数据。到目前为止，我还没有设法这样做。

我将 json 文件放在我的静态目录中，并尝试像这样访问这些文件：

const { data } = await axios.get(
        '_nuxt/static/json/staticData.json',
        { baseURL: window.location.origin }
      )

我可以从静态目录访问其他静态文件，例如图像，但是 json 文件会生成 404 错误。我应该选择其他目录还是尝试完全不同的方法？

【问题讨论】：

标签： json vue.js axios

【解决方案1】：

我包含了路径段“_nuxt/static/”，因为我检查以供参考的渲染图像文件的 URL 也包含它。原来这不是我的 Axios 调用的正确 URL。代码应该这样写：

const { data } = await axios.get(
        '/json/staticData.json',
        { baseURL: window.location.origin }
      )

【讨论】：