stopRecorder() 不工作 - react-native-audio-recorder-player

Question

我正在尝试使用包react-native-audio-recorder-player在 react native 应用程序中录制音频。 录音成功开始，但即使在调用stopRecorder()后仍继续录音。

尝试了来自 gitHub 的许多解决方案，但没有任何帮助。 这是我的代码

import React from 'react';
import { View, TouchableOpacity, Text} from 'react-native';
import AudioRecorderPlayer from 'react-native-audio-recorder-player';

export const Recorder = () => {
 const audioRecorderPlayer = new AudioRecorderPlayer();

 const onStartRecord = async () => {
  await audioRecorderPlayer.startRecorder();
  audioRecorderPlayer.addRecordBackListener(e => {
    console.log('Recording . . . ', e.current_position);
     return;
    });
  };

 const onStopRecord = async () => {
  const audio = await audioRecorderPlayer.stopRecorder();
  audioRecorderPlayer.removeRecordBackListener();
  };

 return (
  <View style={{flex: 1, justifyContent: 'center', alignItems: 'space-between'}}>
   <TouchableOpacity onPress={onStartRecord}>
     <Text>Start</Text>
   </TouchableOpacity>

   <TouchableOpacity onPress={onStopRecord}>
     <Text>Stop</Text>
   </TouchableOpacity>
  </View>
 );
};

即使按下 Stop 后，控制台仍会收到Recording 。 . . ，以下是我的控制台。

Answer 1

对于这项工作，需要添加const audioRecorderPlayer = new AudioRecorderPlayer(); 组件外。 所以，组件看起来像这样。

import React from 'react';
import { View, TouchableOpacity, Text} from 'react-native';
import AudioRecorderPlayer from 'react-native-audio-recorder-player';

const audioRecorderPlayer = new AudioRecorderPlayer();

export const Recorder = () => {
 const onStartRecord = async () => {
  await audioRecorderPlayer.startRecorder();
  audioRecorderPlayer.addRecordBackListener(e => {
    console.log('Recording . . . ', e.current_position);
     return;
    });
  };

 const onStopRecord = async () => {
  const audio = await audioRecorderPlayer.stopRecorder();
  audioRecorderPlayer.removeRecordBackListener();
  };

 return (
  <View style={{flex: 1, justifyContent: 'center', alignItems: 'space-between'}}>
   <TouchableOpacity onPress={onStartRecord}>
     <Text>Start</Text>
   </TouchableOpacity>

   <TouchableOpacity onPress={onStopRecord}>
     <Text>Stop</Text>
   </TouchableOpacity>
  </View>
 );
};

在此更改之后，我的 stopRecorder 就像魅力一样工作。