Breaking News: Grepper is joining You.com. Read the official announcement!

how to call api on load using hooks in react

Panicky Panther answered on May 28, 2021 Popularity 3/10 Helpfulness 2/10

answer how to call api on load using hooks in react

how to call api on load using hooks in react

Comment

function User() {
  const [firstName, setFirstName] = React.useState(null);
  const [lastName, setLastName] = React.useState(null);
  
  React.useEffect(() => {
    fetch('https://randomuser.me/api/')
      .then(results => results.json())
      .then(data => {
        const {name} = data.results[0];
        setFirstName(name.first);
        setLastName(name.last);
      });
  }, []); // <-- Have to pass in [] here!

  return (
    <div>
      Name: {!firstName || !lastName ? 'Loading...' : `${firstName} ${lastName}`}
    </div>
  );
}

ReactDOM.render(<User />, document.querySelector('#app'));

Popularity 3/10 Helpfulness 2/10 Language javascript

Source: stackoverflow.com

Tags: api call javascript load using

Link to this answer
Share Copy Link