reactjs - Expo-av 音频录制

Question

我正在尝试使用 expo-audio 录制音频，但当我开始录制时它显示错误错误:在给定时间只能准备一个录制对象。 和错误:无法卸载尚未准备的录音。我也遵循了文档，但仍然遇到相同的错误。

下面是我开始录制的代码

  const [recording, setRecording] = React.useState();

  async function startRecording() {
    try {
      console.log('Requesting permissions..');
      await Audio.requestPermissionsAsync();
      await Audio.setAudioModeAsync({
        allowsRecordingIOS: true,
        playsInSilentModeIOS: true,
      }); 
      console.log('Starting recording..');
      const recording = new Audio.Recording();
      await recording.prepareToRecordAsync(Audio.RECORDING_OPTIONS_PRESET_HIGH_QUALITY);
      await recording.startAsync(); 
      setRecording(recording);
      console.log('Recording started');
    } catch (err) {
      console.error('Failed to start recording', err);
    }
  }

以及停止录制

async function stopRecording() {
    console.log('Stopping recording..');
    setRecording(undefined);
    await recording.stopAndUnloadAsync();
    const uri = recording.getURI(); 
    console.log('Recording stopped and stored at', uri);
  }

有人知道我为什么会收到这个错误吗？

Answer 1

不要使用recording作为状态变量。重新渲染使得变量一次又一次初始化

在您使用的函数或类之外声明一个这样的变量

let recording = new Audio.Recording();

然后像这样使用

import * as React from 'react';
import { Text, View, StyleSheet } from 'react-native';
import { Audio } from "expo-av";

let recording = new Audio.Recording();

export default function App() {
  async function startRecording() {
    try {
      console.log('Requesting permissions..');
      await Audio.requestPermissionsAsync();
      await Audio.setAudioModeAsync({
        allowsRecordingIOS: true,
        playsInSilentModeIOS: true,
      });
      console.log('Starting recording..');
      await recording.prepareToRecordAsync(
        Audio.RECORDING_OPTIONS_PRESET_HIGH_QUALITY
      );
      await recording.startAsync();
      console.log('Recording started');
    } catch (err) {
      console.error('Failed to start recording', err);
    }
  }

  async function stopRecording() {
    console.log('Stopping recording..');
    await recording.stopAndUnloadAsync();
    const uri = recording.getURI();
    console.log('Recording stopped and stored at', uri);
  }

  return <View>// Your App contents here</View>;
}