react 播放音频

React 中播放音频通常涉及到使用HTML5的Audio API。你可以创建一个组件，然后在这个组件内部实例化一个Audio对象，并设置其src属性指向音频文件。以下是一个简单的示例：

import React, { useRef, useEffect } from 'react';

const AudioPlayer = () => {
  const audioRef = useRef(new Audio());

  // 音频加载完成后再开始播放
  useEffect(() => {
    audioRef.current.src = 'path_to_your_audio_file.mp3'; // 替换为你实际的音频路径
    audioRef.current.addEventListener('canplaythrough', function() {
      audioRef.current.play();
    });
    return () => {
      audioRef.current.pause(); // 确保组件卸载时停止播放
    };
  }, []);

  return (
    <div>
      <audio ref={audioRef} controls>您的浏览器不支持音频</audio>
    </div>
  );
};

export default AudioPlayer;

这个组件会在音频加载完成后自动播放，用户也可以通过控制台的controls属性手动播放、暂停、调整音量等。如果音频文件还没有完全加载，`canplaythrough`事件会被触发。