37 lines
688 B
Vue
37 lines
688 B
Vue
<template>
|
||
<span>
|
||
<button type="button" @click="playAudio()">▶️</button>
|
||
<audio ref="audio" style="display: none"></audio>
|
||
</span>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { useTemplateRef } from "vue";
|
||
import { stop as stopTTS } from "tauri-plugin-tts-api";
|
||
|
||
const props = defineProps<{
|
||
src: string;
|
||
}>();
|
||
|
||
defineExpose({
|
||
playAudio,
|
||
});
|
||
|
||
const audioEl = useTemplateRef("audio");
|
||
|
||
async function playAudio() {
|
||
if (!audioEl.value) return;
|
||
|
||
document.querySelectorAll("audio").forEach((el) => {
|
||
el.pause();
|
||
});
|
||
stopTTS();
|
||
|
||
audioEl.value.src = props.src;
|
||
audioEl.value.currentTime = 0;
|
||
await audioEl.value.play();
|
||
}
|
||
</script>
|
||
|
||
<style module></style>
|