在React Native App中添加语音录制功能

yc0p9oo0  于 2023-05-07  发布在  React
关注(0)|答案(1)|浏览(216)

我正在尝试在我的React Native应用程序中添加一个功能,以便能够创建语音注解并在我的Django后端(POST API)中发送。
使用import AudioRecorderPlayer from 'react-native-audio-recorder-player';库。
在我的组件中,我使用TouchableOpacity创建了Buttons。按钮为“开始录制”、“停止录制”和“播放音频”。
当我使用这些按钮中的任何一个来调用我的方法时,我得到以下错误:

[00:09:51] null is not an object (evaluating 'RNAudioRecorderPlayer.startPlayer')
at node_modules\react-native-audio-recorder-player\index.ts:null in AudioRecorderPlayer#startPlayer
at node_modules\@babel\runtime\helpers\asyncToGenerator.js:null in asyncGeneratorStep
at node_modules\@babel\runtime\helpers\asyncToGenerator.js:null in _next
at node_modules\@babel\runtime\helpers\asyncToGenerator.js:null in Promise$argument_0
at node_modules\react-native\node_modules\promise\setimmediate\core.js:null in tryCallTwo
at node_modules\react-native\node_modules\promise\setimmediate\core.js:null in doResolve
at node_modules\react-native\node_modules\promise\setimmediate\core.js:null in Promise
at node_modules\@babel\runtime\helpers\asyncToGenerator.js:null in <anonymous>
at node_modules\react-native-audio-recorder-player\index.ts:null in AudioRecorderPlayer

下面是我的代码:

const startRecording = async () => {
    try {
      const path = await audioRecorderPlayer.startRecorder();
      audioRecorderPlayer.addRecordBackListener((e) => {
      this.setState({
        recordSecs: e.currentPosition,
        recordTime: this.audioRecorderPlayer.mmssss(Math.floor(e.currentPosition)),
      })
    })
      setAudioPath(path);
      console.log(path)
  } catch (error) {
    console.error(error);
  }
}

  const stopRecording = async () => {
    try {
      const path = await audioRecorderPlayer.stopRecorder();
      audioRecorderPlayer.removeRecordBackListener((e) => {
        this.setState({
          recordSecs: 0,
        })
      })
      setAudioPath(path);
      console.log(path)
    } catch (error) {
      console.error(error);
    }
  }

  const playRecording = async () => {
    try {
      await audioRecorderPlayer.startPlayer(audioPath);
    } catch (error) {
      console.error(error);
    }
  };

在我的组件之外是AudioRecordPlayer()的示例;

const audioRecorderPlayer = new AudioRecorderPlayer();
lymgl2op

lymgl2op1#

希望这对您有帮助。

const audioRecorderPlayer = useRef(new AudioRecorderPlayer()).current;

这就是我如何解决我的错误

相关问题