async await function inside useEffect hook code example
Example 1: react useeffect async
const MyFunctionnalComponent: React.FC = props => {
useEffect(() => {
(async function anyNameFunction() {
await loadContent();
})();
}, []);
return <div></div>;
};
Example 2: async useEffect
function OutsideUsageExample() {
const [data, dataSet] = useState<any>(null)
const fetchMyAPI = useCallback(async () => {
let response = await fetch('api/data')
response = await response.json()
dataSet(response)
}, [])
useEffect(() => {
fetchMyAPI()
}, [fetchMyAPI])
return (
<div>
<div>data: {JSON.stringify(data)}</div>
<div>
<button onClick={fetchMyAPI}>manual fetch</button>
</div>
</div>
)
}