• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

109
Views
Does calling useState function inside another useState callback cause multiple renders?

I have some code like the sample below where I call a state setter inside the callback for another state setter. All of this needs to happen inside a useCallback hook to avoid the useEffect hook being called on every render.

My question is, how many renders does the useCallback hook trigger? Would setBar here trigger another render? And if so, is there a more efficient way to write this to trigger fewer renders (without removing the useEffect hook)?

Bear in mind that the code below is just a simplified example of the code in my application.

const [foo, setFoo] = useState(0)
const [bar, setBar] = useState(0)

const baz = useCallback(() => {
  setFoo((prevState) => {
    const newState = prevState += 1
    // does this trigger another render?
    setBar(newState)
    return newState
  })
})

useEffect(() => baz, [baz])

about 3 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error