JSON服务器：位置0的JSON中的意外令牌<

Question

我尝试用代码中的db.json实现JSON服务器，但尚无法访问数据。显示了上面的错误-我研究了它与我试图解析的不是json的响应有关... 我该如何解决？有人可以帮忙吗？

async function getData() {
  const promise = await fetch("http://localhost:3001/data").then(response =>
    response.json()
  );
  return promise;
}

export default function Home() {
  const [searchValue, setSearchValue] = useState("");

  const [data, setData] = React.useState([]);
  React.useEffect(() => {
    getData().then(fetchedData => {
      setData(fetchedData);
    });
  }, []);

  const filteredData = data.filter(item =>
    item.name.toLowerCase().includes(searchValue.toLowerCase())
  );

  function handleSearch(value) {
    setSearchValue(value);
  }

  return (
    <div>
      <Searchbar onSearch={handleSearch} />
      <BadgeButtonList data={filteredData} />
    </div>
  );
}

db.json看起来像这样：

{
  "data": [
    {
      "name": "Apple",
      "id": 1,
      "alt": [
        {
          "name": "Fruit1",
          "description": "AAA"
        },
        {
          "name": "Fruit2",
          "description": "BBB"
        }
      ]
    },
    {
      "name": "Banana",
      "id": 2,
      "alt": [
        {
          "name": "ExoticFruit1",
          "description": "XXX"
        },
        {
          "name": "ExoticFruit2",
          "description": "YYY"
        }
      ]
    }
  ]
}

我们将不胜感激！