0.0.4 • Published 8 years ago
react-voice-input v0.0.4
react-voice-input
Voice input component for React.JS
Installation
$ npm install react-voice-input
Usage
import ReactVoiceInput from 'react-voice-input'
import React from 'react'
class MyApp extends React.Component {
constructor (props) {
super(props)
this.state = {
inputText: ''
}
this.onResult = this.onResult.bind(this)
this.onInputChange = this.onInputChange.bind(this)
}
onInputChange (event) {
this.setState({
inputText: event.target.value
})
}
onResult (result) {
this.setState({
inputText: result
})
}
render () {
const onEnd = () => {
console.log('on end')
}
return (
<main>
<ReactVoiceInput
onResult={this.onResult}
onEnd={onEnd}
>
<input type='text' value={inputText} onChange={this.onInputChange} />
</ReactVoiceInput>
</main>
)
}
}
API
onSpeechStart()
- optional callback function to detect speech startonResult(value)
- callback function when get value from speechonEnd()
- optional callback function when the speech endonError(event)
- optional callback function when there's an errorcontainerClassName
- optional, the class name apply to the container, default torvi-contianer
microphoneClassName
- optional, the class name apply to microphone, default torvi-microphone
microphoneStyle
- optional inline style for the button
For how to use it, check the example
folder.
Run example
$ cd example
$ yarn
$ yarn run dev
Then go to http://localhost:3000/ in browser.
License
MIT