React.js中react-fetch和whatwg-fetch的区别是什么

React-fetch和Whatwg-fetch都是用于在React应用中进行HTTP请求的库，但它们用于不同的目的并具有不同的特性。

React-fetch： react-fetch是一个为React应用提供进行数据获取和处理错误的高阶组件（HOC）的库。它允许你使用withFetch HOC包装你的组件，提供一个包含从服务器获取的数据的data prop和一个指示fetch请求状态的status prop。它还允许你以集中化的方式处理错误。这意味着你可以定义一个单个的错误处理函数，当在fetch请求过程中发生错误时会调用该函数，并通过props传递给所有被包装的组件。

示例：

import withFetch from 'react-fetch'; 
  
class MyComponent extends React.Component { 
    render() { 
        if (this.props.status === 'loading') { 
            return <div>Loading...</div>; 
        } 
        if (this.props.status === 'error') { 
            return <div>Error: {this.props.error.message}</div>; 
        } 
        return <div>Data: {this.props.data}</div>; 
    } 
} 
  
const MyFetchingComponent = withFetch(MyComponent, { 
    url: 'https://api.example.com/data', 
    method: 'GET', 
}); 

Whatwg-fetch： 它是一个提供对fetch API进行最小化polyfill的库，fetch API是JavaScript中进行HTTP请求的现代标准。Fetch API提供了获取资源的接口（包括通过网络获取）。对于使用过XMLHttpRequest的人来说，它会感到熟悉，但是新的API提供了更强大和灵活的功能集。它允许您使用fetch函数进行请求，并返回一个解析为Response对象的promise，其中包含响应的数据和头部信息。然后，您可以在响应对象上使用json()方法来解析响应为json格式。

示例：

fetch('https://api.example.com/data') 
    .then(response => response.json()) 
    .then(data => { 
        console.log(data); 
    }); 

React-fetch和Whatwg-fetch之间的区别：

• React-fetch 是一个库，为React应用程序提供了一个高阶组件（HOC）来获取数据并处理错误。它允许您使用withFetch HOC包装组件，它提供了一个包含从服务器获取的数据的data属性，以及指示fetch请求状态的status属性。它还允许您以集中方式处理错误。
• Whatwg-fetch 是一个库，为fetch API提供了一个最小的polyfill，该API是JavaScript中进行HTTP请求的现代标准。它允许您使用fetch函数进行请求，并返回一个带有响应数据和头部的Response对象的promise。它允许您通过将.catch方法链接到promise来处理错误。