时间戳

首页 > 解决方案 > react-native-audio-toolkit，isPlaying 不起作用

react-native - react-native-audio-toolkit，isPlaying 不起作用

问题描述

import React from "react";
import { Player } from "@react-native-community/audio-toolkit"; 


export default class RNAudiotoolkit extends React.Component {
componentDidMount(){
    new Player("some_audio_file.mp3").play();
    console.log(Player.isPlaying);
}
}

以上是我精简到的最小代码，音轨确实可以播放，但是 console.log(Player.isPlaying) 总是返回“false”，但音频文件正在运行。关于为什么这不起作用的任何输入。我只能怀疑它与 MediaStates 有关，但没有成功地得到任何工作。如果您有使用此软件包的经验，我们将不胜感激。

文档：https ://github.com/react-native-community/react-native-audio-toolkit/blob/master/docs/API.md

标签： react-native

解决方案

编辑：已修复并经过测试；答案是我原来的答案和 mAhMoUdDaFeR 答案的结合。

如果您查看该play方法的文档上方，您将看到prepare(Function callback). 其中，它指出：

...否则在调用 play() 时会准备文件，这可能会导致小延迟。

这意味着如果您.isPlaying在调用后立即检查属性play()，则不能保证文件在您console.log(Player.isPlaying)执行时实际正在播放。

还有第二个问题.isPlaying不是Player该类的静态属性，尽管它在文档中是如何出现的。它实际上是Player您需要创建以播放音频文件的实例的属性。

如果您想看到它.isPlaying确实正常工作，一项潜在的检查是在传递.play()给文档显示的回调函数中运行您的代码：

play(Function ?callback)

开始播放。

如果给出回调，则在播放开始时调用它。

所以一个简单的例子是这样编写你的示例代码（保存创建的实例，然后登录回调）：

componentDidMount(){
    const p = new Player("some_audio_file.mp3").play(() => console.log('in callback', p.isPlaying));
    console.log('immediately after play', p.isPlaying);
}

我创建了一个新项目来测试这个，如果你运行上面的代码，你会看到下面的打印出来说明这个问题：

immediately after play false
in callback true

推荐阅读