音频文件无法在reactjs中播放

Question

我一直在尝试在 Recact.js 中播放音频文件，但它无法播放。我没有遇到任何错误，滚动条显示，但播放按钮不起作用。我尝试播放该歌曲以检查文件是否已损坏。mp3 文件工作正常。

import React from 'react'

class AudioPlayer extends React.Component {
  render() {
    return (
      <div>
        <audio ref="audio_tag" src="./abc.mp3" controls autoPlay/>
      </div>
    );
  }
}

export default AudioPlayer;

Answer 1

由于您使用的是 create-react-app，我建议您将 mp3 文件移动到公共文件夹，然后使用我所说的 pathToPublic 尝试以下操作，无论您需要进入文件的路径是什么：

import abc from '.../pathToPublic/public/abc.mp3'

<audio
  ref="audio_tag"
  autoPlay={true}
  controls={true} >
  <source type="audio/mp3" src={abc} />
</audio>

并让我们知道它是否有效。