在React中，可以使用内置的fetch函数发送HTTP请求。fetch函数提供了一种现代的、基于Promise的方式来处理异步数据请求。
使用fetch发送请求的步骤
以下是使用fetch发送请求的一般步骤：
- 构造请求：使用fetch函数创建一个请求对象，指定请求的URL、方法、头部、主体等。
- 发送请求：使用fetch函数发送请求，并返回一个Promise对象，该对象在请求完成后将解析为响应对象。
- 处理响应：通过对响应对象调用相应的方法（如
json()、text()、blob()等）来解析响应数据。 - 处理错误：使用Promise的catch方法捕获请求过程中发生的错误，并进行错误处理。
现在，让我们通过一个示例来演示在React中使用fetch发送请求的过程。
示例
代码语言：javascript复制class MyComponent extends React.Component {
componentDidMount() {
// 发送GET请求
fetch('https://api.example.com/data')
.then(response => {
if (response.ok) {
return response.json();
} else {
throw new Error('请求失败');
}
})
.then(data => {
// 处理响应数据
console.log(data);
})
.catch(error => {
// 处理错误
console.error(error);
});
}
render() {
return <div>正在加载数据...</div>;
}
}在上面的示例中，我们在组件的componentDidMount生命周期方法中使用fetch发送了一个GET请求到https://api.example.com/data。然后，我们使用.then方法处理成功的响应，并通过.catch方法捕获任何错误。
在请求的回调函数中，我们首先检查响应对象的ok属性，以确定请求是否成功。如果成功，我们调用json()方法来解析响应数据，并在解析完成后处理数据。如果请求失败，我们抛出一个错误，然后在.catch块中捕获并处理。
此外，为了在请求过程中提供用户反馈，我们在组件的渲染方法中显示一个加载提示信息。
