Reactjs 反应：未处理的拒绝（SyntaxError）：意外标记<；在JSON中的位置0

我正在尝试对本地json文件发出获取请求，但收到以下错误消息：

未处理拒绝（SyntaxError）：json中位于位置0的意外标记

指向

response.json（）

。我尝试添加proxy package.json，但我得到了500个内部错误。我怎样才能解决这个问题

componentDidMount（）{
取（'http://localhost:3000/items.json')
.然后（功能（响应）{
如果（response.status>=400）{
抛出新错误（“错误响应”）；
}
返回response.json（）；
})
.then（功能（数据）{
console.log（数据）
});
}

json文件：

[
{
数据：[
{
名称：“cnt”，
级别：“12”
},
{
姓名：“斯图尔特”，
级别：“6”
},
{
名称：“nic”，
级别：“7”
}
]
}
]

将您的文件放入

公共

文件夹，而不是

src

如果您使用的是Create React App，则没有其他后台运行可以为您的JSON文件提供服务。考虑用Webpack代替它。

从'./items.json'导入数据；
类应用程序扩展了React.Component{
componentDidMount（）{
控制台日志（数据）；
}
// ...
}

或者，您可以将该文件放在

public

文件夹中，这样您就可以从同一来源获取该文件

类应用程序扩展了React.Component{
componentDidMount（）{
获取（“/items.json”）
。然后（响应=>{
如果（！response.ok）{
抛出新错误（“错误响应”）；
}
返回response.json（）；
})
.then（数据=>console.log（数据））
.catch（error=>console.error（error））；
}
// ...
}

您的后端部分是什么？我正在使用create react应用程序。我正在app.js中提取您的文件位于哪个文件夹？如果它只是create-react-app，则没有其他后台运行可以为您的JSON文件提供服务。考虑用Webpack导入它。代码>从“/items.json”导入obj。如果您将文件放在

public

文件夹中，您将能够从相同的来源获取它：

fetch（'/items.json'）

我尝试了这两种方法，然后

fetch（'/items.json'）

在公用文件夹中工作。