Closed hvardhan617 closed 4 years ago
Hi @hvardhan617
A few pointers:
checkForWakeword
and abortListening
in the render
method. They will only be called when the Dictaphone
is re-rendered - you want them to be called when the isWakeWordFound
state is changed. Also, these functions do not return valid JSX - only JSX should be returned by render
.transcript
and react appropriately. Using the old React lifecycle hooks, you can achieve this using componentWillReceiveProps
. When the value of transcript
changes, you can check for a wake word. If there is a wake word, abort listening; else, do nothing. The code could look something like this:
componentWillReceiveProps(nextProps) {
const { transcript, abortListening } = this.props;
// If transcript has changed and it contains a wake word, stop listening
if (transcript !== nextProps.transcript &&
containsWakeWord(nextProps.transcript)) {
abortListening();
}
}
Then you can remove isWakeWordFound
and these lines from the render
method:
{!this.state.isWakeWordFound ? this.checkForWakeword(transcript) : null}
{this.state.isWakeWordFound ? abortListening() : null}
How do i stop re render or processing the transcript once the configured wakeword is found. Here is the code snippet i am using.
The end goal is to abort Listening whenever a hotword is found.How do i achieve this?
Right now even though, abort Listning is being called once, due to transcript in render props, it is constantly unable to update the state, hence throwing the below error in console.