当在react js上触发onClick方法时，有没有办法在特定的时间间隔内播放声音？

import React, { useState } from 'react';

const MyComponent = () => {
  const audio = new Audio('/path/to/sound.mp3');
  // 其中，'/path/to/sound.mp3' 是你的音频文件路径

  const handleClick = () => {
    audio.play();
    // 在点击事件中调用 play() 方法播放音频
  };

  return (
    <button onClick={handleClick}>点击播放声音</button>
  );
};

export default MyComponent;

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

const MyComponent = () => {
  const audio = new Audio('/path/to/sound.mp3');
  const [isPlaying, setIsPlaying] = useState(false);

  const handleClick = () => {
    setIsPlaying(true);
  };

  useEffect(() => {
    if (isPlaying) {
      audio.play();

      const interval = setInterval(() => {
        audio.currentTime = 0;
        audio.play();
      }, 1000); // 设置每隔1秒钟播放一次声音

      return () => {
        clearInterval(interval);
      };
    }
  }, [isPlaying]);

  return (
    <div>
      <button onClick={handleClick}>开始播放声音</button>
      <button onClick={() => setIsPlaying(false)}>停止播放声音</button>
    </div>
  );
};

export default MyComponent;