axios vs fetch
Oct 24, 2020
const [countries, setCountries] = useState([]);
const [cart, setCart] = useState([]);// Load Data with fetch;useEffect(() =>{
const url = 'https://restcountries.eu/rest/v2/all'
fetch(url)
.then(res => res.json())
.then(data =>setCountries(data))
.catch(error => console.log(error))
},[]);// Load Data with axios;
useEffect(() =>{
const url = 'https://restcountries.eu/rest/v2/all'
axios(url)
.then(data => setCountries(data.data.countries))
},[]);
Axios has url in request object. Axios is a stand-alone third party package that can be easily installed. Axios uses the data property. Axios has wide browser support. Axios performs automatic transforms of JSON data.
Fetch has no url in request object. Fetch is built into most modern browsers; no installation is required as such. Fetch is a two-step process when handling JSON data- first, to make the actual request; second, to call the .json() method on the response.
