/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 vote236 views1 answer
How to use mdbreact in react js
Javascript React
4 votes210 views2 answers
Get request react
Javascript React
0 vote210 views1 answer
Command reboot android app react native adb command
Javascript React
0 vote206 views1 answer
Setstate before function react
Javascript React
0 vote196 views1 answer
Import React from 'react'; import {Router, Scene} from 'react-native-router-flux';
Javascript React
0 vote254 views1 answer
How to make react native dapp truffle
Javascript React
0 vote239 views1 answer
Rotas react com axios
Javascript React
0 vote199 views1 answer
Reactive forms angular conditional disabling
Javascript React
5 votes243 views1 answer
React in laravel
Javascript React
0 vote222 views1 answer
Making font weight bold by passing value in React.js
Javascript React