react怎么读取json数据

在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的最新推荐用法。