在 iOS 端停止回声反应原生录音播放器？在我播放语音剪辑的代码下方，我从上一个屏幕发送到这里

问题描述

import * as Progress from 'react-native-progress'; 从 '../../common/GConstants' 导入 { FontFamily,Fonts };

从'react-native'导入{ Image,SafeAreaView,StyleSheet,Text,TouchableOpacity,View };

import React,{ Component } from 'react';

import { heightPercentagetoDP as hp,widthPercentagetoDP as wp } from 'react-native-responsive-screen';

从'react-native-audio-recorder-player'导入AudioRecorderPlayer；

从'../../common/GColors'导入颜色；

从'../../common/GColors'导入GColors；

从'react-native-keep-awake'导入KeepAwake；

从'react-native-audiowaveform'导入波形；

从'../../assets/images/index'导入图片；

import { secondsToTime } from '../../common/GFunction';

导出默认类 ConfirmRecording extends Component {

构造函数（）{

super();

this.state = {
  recordTime: '',duration: '',isPlaying: false,totalDuration: '',audioPath: '',currentPositionSec: '',currentDurationSec: '',};
this.audioRecorderPlayer = new AudioRecorderPlayer();

}

showProgress = () => {

if (this.state.currentPositionSec / this.state.totalDuration > 1) {
  return Math.round(
    this.state.currentPositionSec / this.state.totalDuration,);
} else {
  return Math.fround(
    this.state.currentPositionSec / this.state.totalDuration,);
}

};

onStartPlay = async() => {

console.log('START   and is playing',this.state.audioPath + "--------" + this.state.isPlaying);
if (this.state.isPlaying) {
  this.setState({ isPlaying: false });
  this.audioRecorderPlayer.stopPlayer();
  this.audioRecorderPlayer.removePlayBackListener();

} else {
  const msg = await this.audioRecorderPlayer.startPlayer(
    this.state.audioPath,// 'http://podcasts.cnn.net/cnn/services/podcasting/specials/audio/2007/05/milesobrien.mp3',);
  console.log('Play MSG',msg);
  this.audioRecorderPlayer.addplayBackListener((e) => {
    this.setState({
      isPlaying: true,currentPositionSec: Math.round(
        Math.round(Math.round(e.current_position / 10) / 100),),currentDurationSec: Math.round(Math.round(e.duration / 10) / 100),playTime: e.current_position,duration: e.duration,});

    if (e.duration == e.current_position) {
      this.setState({ isPlaying: false });
      console.log('Stopped');
      this.audioRecorderPlayer.stopPlayer();
      this.audioRecorderPlayer.removePlayBackListener();
    }
    return;
  });
}

};

componentDidMount = () => {

var audioPath = this.props.navigation.getParam('audioPath');
var duration = this.props.navigation.getParam('duration');
console.warn("Data from prevcIoUyas screen",audioPath + "--------" + duration)
this.setState({
  audioPath: audioPath,duration: duration
});

}

componentwillUnmount = () => {

this.audioRecorderPlayer.stopPlayer();
this.audioRecorderPlayer.removePlayBackListener();
this.setState({
  audioPath: '',isPlaying: false
});

}

渲染（）{

return (
  <SafeAreaView style={style.mainContainer}>
    <View style={style.audioView}>
      <Text style={style.audioViewText}>Confirm Recording</Text>
      <View style={{ marginTop: hp(2) }}>
        <View style={style.secondWaveView}>

          <WaveForm
            style={style.WaveForm}


            source={{ uri: this.state.audioPath }} // not work

            stop={this.state.isPlaying}

            play={this.state.isPlaying}

            // autoplay={true}

            waveFormStyle={{ waveColor: Colors.gray,scrubColor: Colors.darkBlue }}

          />

          <Text> {secondsToTime(this.state.currentPositionSec)
            .m.toString()
            .padStart(2,0) +
            ':' +
            secondsToTime(this.state.currentPositionSec)
              .s.toString()
              .padStart(2,0)}</Text>
        </View>
        <View style={style.secondAudioView}>
          <TouchableOpacity

            onPress={(event) => {
              this.audioRecorderPlayer.stopPlayer();
              this.audioRecorderPlayer.removePlayBackListener();
              this.setState({ audioPath: '',isPlaying: false },() => {
                // add ImeRSSion
                // this.props.navigation.state.params.a(true),this.props.navigation.navigate('ImpressionPro')
              });


            }
            }

            activeOpacity={.9}>
            <Image source={images.sendIcon} />
          </TouchableOpacity>
          <View style={{ flex: 1 }} />
          <TouchableOpacity style={style.icon}
            onPress={() => {
              this.audioRecorderPlayer.stopPlayer();
              this.audioRecorderPlayer.removePlayBackListener();
              this.setState({ audioPath: '',() => {
                this.props.navigation.pop(2)

              });

            }}
            activeOpacity={.9}>
            <Image source={images.deleteCancelBtn} />
          </TouchableOpacity>
          <TouchableOpacity
            onPress={() => {
              this.onStartPlay()
                .then(() => {
                  console.log('Playing');
                })
                .catch((err) => {
                  console.log('PErr',err);
                });
            }}
            style={style.icon} activeOpacity={.9}>
            <Image source={images.playBtn} />
          </TouchableOpacity>
        </View>
      </View>
    </View>
    <KeepAwake />
  </SafeAreaView>
)

} }

const style = StyleSheet.create({

主容器： {

flex: 1,backgroundColor: Colors.darkBlue,justifyContent: 'center',alignItems: 'center'

},第二波视图： {

marginTop: hp(2),marginHorizontal: wp(5.5),flexDirection: 'row',justifyContent: 'space-between',

},第二个音频视图： {

flexDirection: 'row',marginTop: hp(2),marginStart: wp(5)

},波形： {

height: 25,flex: 1,图标：
{

marginEnd: wp(5)
},音频视图：
{
backgroundColor: Colors.white,高度：“25%”，
宽度：“88%”，
alignSelf: '居中',边界半径：hp(2),
},音频视图文本：
{
textAlign: '居中',字体大小：Fonts.fontsize20，
边距水平： wp(6),fontFamily: FontFamily.medium,
颜色：Colors.textCoffeeColor
},
})
解决方法
 
暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！
 
如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。
 
小编邮箱:dio#foxmail.com (将#修改为@）