Javascript 在React应用程序中加载本地Json文件

我试图理解如何在react中导入json文件

如果我这样做

import jsonData from "./file.json";
console.log(jsonData[60]);

为什么要打印出

浏览

导入是否会自动将json转换为js obj，因为我们不必解析它

为什么对提供JSON的API执行fetch调用需要解析为js obj

这两种方法都提供json，两者的区别是什么

myfile.json看起来像

{
  "60" : {
    "action": "explore",
    "confd": "0.998647"
  },
  "120": {
    "action": "explore",
    "confd": "0.998647"
  },
  "180": {
    "action": "explore",
    "confd": "0.998647"
  }
}


创建一个.js文件，然后将JSON数据放入其中
然后将其导出


从希望访问的位置导入JSON数据

JSON文件是一个JS对象。这就是JSON的字面意思，所以没有“转换”。如果只打印
jsonData
，应该可以看到它的形状和内容。我不知道为什么会得到这个输出，但是检查数据的形状。但是，当我简单导入一个json文件时，它的行为就像一个obj，不进行解析。然而，在使用获取调用（JSON）的结果之前，需要将其解析为js obj。请尝试jsonData.JSON（）；例如var myJson=jsonData.json（）；然后使用myJson变量？或者如果您想查看所有jsonData，并且如果它将您显示为一个对象，请尝试以下操作；stringify（jsonData）；我想他想知道使用.json文件和fetch的结果json的行为，而不是如何使用文件中的js对象表示法js@RapSherlock这是正确的。因为导入本地json文件就像导入js Obj一样。但是，在使用fetch调用中的数据之前，必须使用JSON.parse进行转换。


    export const myjson = {
        "60" : {
          "action": "explore",
          "confd": "0.998647"
        },
        "120": {
          "action": "explore",
          "confd": "0.998647"
        },
        "180": {
          "action": "explore",
          "confd": "0.998647"
        }
      };




    import { myjson } from "./jsonData.js";