I have a button in which onClick method is attached which will play a vibaration sound.
Button.js
import React from "react";
import "./button.css";
export default function App() {
let audio = new Audio("/vibrate.mp3");
const start = () => {
audio.play();
};
return (
<button className="btn" onClick={start}>
Click Me
</button>
);
}
Vibration sound is playing whenever we click on button. But if I click button again then it is not playing vibration sound because previous sound is not completed yet.
I want to stop the sound (if playing) and play from start if we click on button.
You can check my sandbox .
I found a solution to stop the audio...
import React from "react";
import "./button.css";
export default function App() {
let audio = new Audio("/vibrate.mp3");
const start = () => {
if(audio.paused === true){
audio.play();
}else{
audio.pause();
audio.currentTime = 0;
audio.play();
}
};
return (
<button className="btn" onClick={start}>
Click Me
</button>
);
}