Question about arrow function using useEffect()

after I read this article When should I use a return statement in ES6 arrow functions, I’m still a little bit confused.Why the following code useEffect uses the curly braces, but without return it still works? Not sure if I misunderstand something.
Here is the example:

import React,{useEffect,useState} from "react"

function App() {
  const [resourcetype,setresourcetype]=useState("posts")

  
  useEffect(()=>{
    console.log("render")
  },[resourcetype])
  
  return (
    <div>
      <button onClick={()=>setresourcetype("try")}>try</button>
      <button onClick={()=>setresourcetype("unknown")}>unknown</button>
    </div>
  );
}

export default App;

23 thoughts on “Question about arrow function using useEffect()”

  1. Here is some information about the useEffect hook: https://reactjs.org/docs/hooks-effect.html

    Essentially useEffect acts as componentDidMount, componentDidUpdate, and componentWillUnmount. Those function are called by React during different parts of the component lifecycle, and do not need a return statement to work, as you can call functions without return statements similarly as you call functions with return statements.

    Reply

Leave a Comment