我正在从事一个项目,我需要将语音翻译成我使用Expo和React-native-voice的文本
我正在做一个项目,需要将语音翻译成文本,我使用了 Expo 和 React-native-voice。 **[未处理的承诺拒绝:TypeError:null 不是对象(评估“Voice.onSpeechStart = null”)] - node_modules\react-native-voice\src\index.js:23:10 在 removeAllListeners 中 - node_modules\promise\setimmediate\core.js:37:14 在 tryCallOne 中 - ... 9 个更多堆栈帧
import React from "react";
import { StyleSheet, Text, View, TouchableOpacity } from "react-native";
import Voice from "react-native-voice";
import * as Permissions from "expo-permissions";
export default class App extends React.Component {
constructor() {
super();
this.state = {
results: [],
};
Voice.onSpeechStart = this.onSpeechStart;
Voice.onSpeechRecognized = this.onSpeechRecognized;
Voice.onSpeechEnd = this.onSpeechEnd;
Voice.onSpeechError = this.onSpeechError;
Voice.onSpeechResults = this.onSpeechResults;
Voice.onSpeechPartialResults = this.onSpeechPartialResults;
Voice.onSpeechVolumeChanged = this.onSpeechVolumeChanged;
}
async componentDidMount() {
const {status} = await Permissions.askAsync(
Permissions.AUDIO_RECORDING
);
}
componentWillMount(){
Voice.destroy().then(Voice.removeAllListeners)
}
onSpeechStart = (e)=> {
console.log('onSpeechStart',e);
};
onSpeechRecognized =(e)=>{
console.log('onSpeechRecognized',e);
}
onSpeechEnd = (e)=>{
console.log('onSpeechEnd'+e);
}
onSpeechError =(e)=>{
console.log('onSpeechError');
}
onSpeechResults = e => {
console.log('onSpeechResults'+e);
this.setState({
results: e.value,
});
}
onSpeechPartialResults = e =>{
console.log('onSpeechPartialResults' + e.value);
}
onSpeechVolumeChanged = e =>{
console.log('onSpeechVolumeChanged');
}
_startRecognizing=async()=>{
try{
await Voice.start('en-US')
} catch(e) {
console.error(e);
}
}
_stopRecognizing = async()=>{
try{
await Voice.stop()
}catch(e){
console.error(e);
}
}
render() {
return (
<View style={styles.container}>
<TouchableOpacity
onPress={this._startRecognizing}
style={{
backgroundColor: "green",
height: 40,
width: 100,
marginBottom: 10,
}}
>
<Text style={{
fontSize: 20,
alignSelf: "center"
}}>
Starts
</Text>
</TouchableOpacity>
<TouchableOpacity
onPress={this._stopRecognizing}
style={{
backgroundColor: "red",
height: 40,
width: 100
}}
>
<Text style={{
fontSize: 20,
alignSelf: "center"
}}>
Stop
</Text>
</TouchableOpacity>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#fff",
alignItems: "center",
justifyContent: "center",
},
});
来自框架内部**
Expo 41+ 更新
随着 Expo SDK 41 的发布,添加了
配置插件
。
react-native-voice/voice
的
3.2.0 版本
添加了对配置插件的支持。
您可以像平常一样安装依赖项
yarn add @react-native-voice/voice
然后您必须更新您的
app.json
"expo": {
"plugins": [
[
"@react-native-voice/voice",
{
"microphonePermission": "Allow $(PRODUCT_NAME) to access your microphone",
"speechRecogntionPermission": "Allow $(PRODUCT_NAME) to securely recognize user speech"
}
]
]
}
您可能需要创建一个新的版本,因为您可能会得到不变违规。
您现在应该阅读 usage
—-
Expo 40 及以上版本
遗憾的是
react-native-voice
与 Expo 不兼容。
原因是 Expo 将原生 iOS 和 Android 代码从您身边抽象出来,这使得构建和开发变得快速而简单,但缺点是您无法添加需要使用原生代码的依赖项。
react-native-voice
需要使用原生代码。安装说明要求您链接原生代码,这一点您可以看出来。请参阅
此处
了解文档。
如果您希望在 Expo 项目中使用此依赖项,则需要将其弹出。您可以在 Expo 文档网站 此处
上找到有关弹出的更多信息以及这样做的利弊
借助 Expo SDK42,您可以使用
react-native-voice
插件,以下是他们在文档中提供的内容
这里
我在使用 react-native-voice 包开发 React Native 应用时遇到了同样的问题。我按照工作流程的每个步骤进行操作(如 react-native-voice 文档中所述以及其他答案所建议的),似乎没有任何问题 -
expo run:android
构建成功。然后我的 android 模拟器/物理设备上的
expo start --dev-client
都抛出了此错误:
[Unhandled promise rejection: TypeError: null is not an object (evaluating 'Voice.isSpeechAvailable')]
最后,我发现,需要在 vscode 中打开两个终端,一个终端运行
exp start
(同时连接到您的设备),另一个终端同时运行
expo run:android
。
然后应用程序就可以在设备上运行了! 希望这对您有所帮助,并希望有人可以就 react-native/expo 测试开发的工作原理进行更多解释?