/Javascript/React/How to call api on load using hooks in react

How to call api on load using hooks in react

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'));

Source: stackoverflow.com

Similar codes

0 vote250 views1 answer
Why does my react project dosent have any class
Javascript React
0 vote249 views1 answer
React tutorial componentDidMount() componentWillUnmount()
Javascript React
0 vote249 views1 answer
Blank array condition in react js
Javascript React
0 vote254 views1 answer
Text inside an image component react native
Javascript React
110 votes247 views2 answers
Create react js app
Javascript React
1 vote253 views1 answer
How to connect socket in react js
Javascript React
0 vote246 views1 answer
How to change tab color react bootstraps customixation
Javascript React
0 vote254 views1 answer
Get rid of header bar react native
Javascript React
0 vote268 views1 answer
Get call log in react native with filter android
Javascript React
0 vote251 views1 answer
Module not found: Can't resolve '@date-io/date-fns' in 'C:\Users\61455\Documents\React apps\mya2o\src\pages'
Javascript React