Speech recognition problem in react state

April 24, 2022

I have a problem with a library react-speech-recognition .
newcontent is a state when modify this state inside useeffect
print undefined
and I also want modify this state for transcript
also print undefined

const Room = () => {
let{
    transcript,
  } = useSpeechRecognition();
 
  const [newContent,setnewcontent]=useState('')
}
console.log(transcript)-->//here successful
 useEffect(() => {
console.log(transcript)-->//here undefined
    setnewcontent(transcript)  
console.log(setnewcontent)-->//here undefined  
},[])

>Solution :

Use 2 separate useEffect. One to update the state and other to keep track on it and do the console.log as follows.

// This useEffect will trigger if any change detected in transcript variable
useEffect(() => {
    setnewcontent(transcript)    
},[transcript])

// This useEffect will trigger if any change detected in newContent state
useEffect(() => { 
    console.log(newContent)
},[newContent])