跳到主要内容

useSpeechSynthesis

分类
导出大小
736 B
上次更改
2 个月前

响应式的 SpeechSynthesis

我可以使用吗?

演示

大家好!早上好!




用法

ts
import { 
useSpeechSynthesis
} from '@vueuse/core'
const {
isSupported
,
isPlaying
,
status
,
voiceInfo
,
utterance
,
error
,
stop
,
toggle
,
speak
,
} =
useSpeechSynthesis
()

选项

以下显示了选项的默认值,它们将直接传递给 SpeechSynthesis API

ts
useSpeechSynthesis
({
lang
: 'en-US',
pitch
: 1,
rate
: 1,
volume
: 1,
})

类型声明

显示类型声明
ts
export type 
UseSpeechSynthesisStatus
= "init" | "play" | "pause" | "end"
export interface UseSpeechSynthesisOptions extends ConfigurableWindow { /** * Language for SpeechSynthesis * * @default 'en-US' */
lang
?:
MaybeRefOrGetter
<string>
/** * Gets and sets the pitch at which the utterance will be spoken at. * * @default 1 */
pitch
?:
MaybeRefOrGetter
<SpeechSynthesisUtterance["pitch"]>
/** * Gets and sets the speed at which the utterance will be spoken at. * * @default 1 */
rate
?:
MaybeRefOrGetter
<SpeechSynthesisUtterance["rate"]>
/** * Gets and sets the voice that will be used to speak the utterance. */
voice
?:
MaybeRef
<SpeechSynthesisVoice>
/** * Gets and sets the volume that the utterance will be spoken at. * * @default 1 */
volume
?:
MaybeRefOrGetter
<SpeechSynthesisUtterance["volume"]>
/** * Callback function that is called when the boundary event is triggered. */
onBoundary
?: (
event
: SpeechSynthesisEvent) => void
} /** * Reactive SpeechSynthesis. * * @see https://vueuse.org.cn/useSpeechSynthesis * @see https://mdn.org.cn/en-US/docs/Web/API/SpeechSynthesis SpeechSynthesis */ export declare function
useSpeechSynthesis
(
text
:
MaybeRefOrGetter
<string>,
options
?: UseSpeechSynthesisOptions,
): {
isSupported
:
ComputedRef
<boolean>
isPlaying
:
ShallowRef
<boolean, boolean>
status
:
ShallowRef
<
UseSpeechSynthesisStatus
,
UseSpeechSynthesisStatus
>
utterance
:
ComputedRef
<SpeechSynthesisUtterance>
error
:
ShallowRef
<
SpeechSynthesisErrorEvent | undefined, SpeechSynthesisErrorEvent | undefined >
stop
: () => void
toggle
: (
value
?: boolean) => void
speak
: () => void
} export type
UseSpeechSynthesisReturn
=
ReturnType
<typeof
useSpeechSynthesis
>

来源

源代码演示文档

贡献者

Anthony Fu
IlyaL
Anthony Fu
sibbng
Jelf
wheat
青椒肉丝
SerKo
Melkumyants Danila
Kirill Shestmintsev
糠帅傅
zwkkwz1
云游君

更新日志

v13.7.0
c0dca - feat(useSpeechSynthesisOptions): 添加选项 onBoundary (#4960)
v13.5.0
4d125 - feat: 添加音量响应式 (#4837)
v12.8.0
7432f - feat(types): 废弃 MaybeRefMaybeRefOrGetter,转而使用 Vue 的原生类型 (#4636)
v12.3.0
59f75 - feat(toValue): 废弃 @vueuse/shared 中的 toValue,转而使用 Vue 的原生函数
0a9ed - feat!: 放弃对 Vue 2 的支持,优化打包并清理 (#4349)
v10.3.0
ac88f - feat: 添加音高和语速响应式 (#3205)

根据 MIT 许可证发布。