0

after some research i came with this react function called flushSync, while reading some examples it says it forces every setState inside to be synchronous, but when i implement it to my code the first time i press the checkbox, it checks on the page, but the react state does not update to checked(true boolean), and the second time i press the checkbox, it unchecks but the react state gets checked, so it unsynchronises, am i doing something wrong or is this a normal behavior?

function handleGenre(e) {
        flushSync(() => {
            setState({...state, genres : {...state.genres, [e.target.name]: e.target.checked}})
          });
        Object.values(state.genres).find(e => e === true) ? console.log('si') : console.log('no')
    }
Aitor
  • 1
  • This is normal. Calling setState does not (and can not) change the closure variable `state`. instead, calling setState just asks react to perform a new render. That new render will create its own local variables, but variables from the previous render are unaffected. `flushSync` only changes when the render happens, not the behavior of variables from the previous render. – Nicholas Tower May 26 '22 at 18:09

0 Answers0