score:0

Accepted answer
import React, {useEffect, useState} from 'react';
import axios from 'axios';
import './data.css';

const fetch = () => axios({
      "method": "GET",
      "url": "https://rest.coinapi.io/v1/exchangerate/BTC/USD",
      "headers": {
        "X-CoinAPI-Key": process.env.REACT_APP_API_KEY
      }
    })
    .then(resp => resp.data)

function App() {
  const [responseData, setResponseData] = useState('');
  
  const doFetch = () => fetch()
    .then(setResponseData)
    .catch(console.log)
  
  useEffect(doFetch, []); //only needed if you fetch on first render

  return (
    <div className='main'>
      <div className="App">
      <header className="App-header">
        <h1>
          Fetching Data with React Hooks
        </h1>
        <button type='button' onClick={doFetch}>Click for Data</button>
      </header>
      <pre>{JSON.stringify(responseData)}</pre>
    </div>
    </div>
  );
}

export default App;

Related Query

More Query from same tag