react中用fetch請求本地json數(shù)據(jù)，返回的是html頁面，并沒有拿到想要的數(shù)據(jù)

在react代碼中想試試讀取本地json數(shù)據(jù)，預期是請求成功后將json數(shù)據(jù)顯示在頁面上，但是在控制臺中看到的是 返回的是 index.html里面的內容，并沒有返回json數(shù)據(jù)。
代碼：
按照例子寫的，參考了別人的問題，把json文件放到index同級的public文件夾下，運行后，會報一個錯（我把.json()方法去掉就不報這個錯）Unexpected token < in JSON at position 0

本地json文件：

項目結構：

控制臺輸出：我以為會輸出json文件里的數(shù)據(jù)內容的....

Network：

剛剛開始學react，想試試用本地的數(shù)據(jù)，就卡這了。
希望大神們能幫助我解答下~~~
萬分感謝?。?/p>