在React中讀取JSON數據可以使用fetch函數來發送請求并獲取數據。以下是一個示例代碼：
import React, { useState, useEffect } from 'react';
const MyComponent = () => {
const [data, setData] = useState([]);
useEffect(() => {
fetch('data.json') // 讀取data.json文件
.then(response => response.json()) // 將響應解析為JSON格式
.then(jsonData => setData(jsonData)) // 將JSON數據存儲到狀態中
.catch(error => console.error(error)); // 處理請求錯誤
}, []);
return (
<div>
{data.map(item => (
<div key={item.id}>
<h2>{item.title}</h2>
<p>{item.description}</p>
</div>
))}
</div>
);
};
export default MyComponent;
在上述代碼中，我們使用fetch函數發送GET請求來讀取data.json文件。然后，我們使用.json()方法將響應解析為JSON格式的數據，并將其存儲到名為data的狀態中。最后，我們使用map函數遍歷data數組，并將每個item的title和description渲染到頁面上。
請注意，上述代碼是一個函數組件，使用了React的Hooks API（useState和useEffect）。使用函數組件和Hooks API是React的最新推薦用法。
