diff --git a/packages/core/useSpeechSynthesis/demo.vue b/packages/core/useSpeechSynthesis/demo.vue index 9fdaa0090ba..db67c7339a7 100644 --- a/packages/core/useSpeechSynthesis/demo.vue +++ b/packages/core/useSpeechSynthesis/demo.vue @@ -2,22 +2,22 @@ import { ref } from 'vue' import { useSpeechSynthesis } from '@vueuse/core' -const lang = ref('en-US') +const voices = ref([]) +const voice = ref() const text = ref('Hello, everyone! Good morning!') const speech = useSpeechSynthesis(text, { - lang, + voice, }) let synth: SpeechSynthesis -const voices = ref([]) - if (speech.isSupported) { // load at last setTimeout(() => { synth = window.speechSynthesis voices.value = synth.getVoices() + voice.value = voices.value[0] }) } @@ -57,7 +57,7 @@ const stop = () => {
- @@ -65,7 +65,7 @@ const stop = () => { v-for="(voice, i) in voices" :key="i" bg="$vt-c-bg" - :value="voice.lang" + :value="voice" > {{ `${voice.name} (${voice.lang})` }} diff --git a/packages/core/useSpeechSynthesis/index.ts b/packages/core/useSpeechSynthesis/index.ts index 884f5283382..e39f3ea530d 100644 --- a/packages/core/useSpeechSynthesis/index.ts +++ b/packages/core/useSpeechSynthesis/index.ts @@ -7,8 +7,6 @@ import { defaultWindow } from '../_configurable' export type Status = 'init' | 'play' | 'pause' | 'end' -export type VoiceInfo = Pick - export interface SpeechSynthesisOptions extends ConfigurableWindow { /** * Language for SpeechSynthesis @@ -31,7 +29,7 @@ export interface SpeechSynthesisOptions extends ConfigurableWindow { /** * Gets and sets the voice that will be used to speak the utterance. */ - voice?: SpeechSynthesisVoice + voice?: MaybeRef /** * Gets and sets the volume that the utterance will be spoken at. * @@ -61,11 +59,6 @@ export function useSpeechSynthesis(text: MaybeRef, options: SpeechSynthe const isPlaying = ref(false) const status = ref('init') - const voiceInfo = { - lang: options.voice?.lang || 'default', - name: options.voice?.name || '', - } - const spokenText = ref(text || '') const lang = ref(options.lang || 'en-US') const error = shallowRef(undefined) as Ref @@ -76,8 +69,7 @@ export function useSpeechSynthesis(text: MaybeRef, options: SpeechSynthe const bindEventsForUtterance = (utterance: SpeechSynthesisUtterance) => { utterance.lang = unref(lang) - - options.voice && (utterance.voice = options.voice) + utterance.voice = unref(options.voice) || null utterance.pitch = pitch utterance.rate = rate utterance.volume = volume @@ -149,7 +141,6 @@ export function useSpeechSynthesis(text: MaybeRef, options: SpeechSynthe isSupported, isPlaying, status, - voiceInfo, utterance, error,