vue3 语音播报流程

npm 安装 "speak-tts": "^2.0.8",

javascript 复制代码
npm install speak-tts

在vue文件中引用

javascript 复制代码
import Speech from "speak-tts";
const speech = ref(null);

onMounted(() => {
    speechInit();
});

//语音播报初始化
const speechInit = () => {
    speech.value = new Speech();
    speech.value.setLanguage("zh-CN");
    speech.value.init({
        volume: 0.6, // 音量0-1
        lang: "zh-CN", // 语言
        rate: 1, // 语速1正常语速,2倍语速就写2
        pitch: 1, // 音调
        voice: "Microsoft Yaoyao - Chinese (Simplified, PRC)",
        listeners: {
            // 事件
            onvoiceschanged: (voices) => {
                // console.log('事件声音已更改', voices);
            },
        },
    });
};
 
  speech.value.speak({ text: "语音播报" });    //正常播放
  speech.value.cancel();                      //取消播放
  speech.value.pause();                       //暂停播放
  speech.value.resume();                      //从暂停的地方恢复播放
相关推荐
苏辰澈10 分钟前
C++自己的族谱规则:继承详解下
c语言·开发语言·c++·visualstudio
hunter19901014 分钟前
英语作文题目
开发语言
liangshanbo121516 分钟前
请求拦截器相关面试题
java·前端·javascript
liangshanbo121519 分钟前
React面试题:Hooks 为什么不能在分支和循环里面写?
前端·javascript·react.js
西红柿炖牛腩35426 分钟前
GLB 转 OBJ/PLY 后体积没变?3D 模型不减面变小靠什么
前端·javascript·3d
谢亮_vipxieliang29 分钟前
Go基础数据类型全解
开发语言·后端·golang
泡海椒31 分钟前
JQuick-Excel 导入反向映射实战:让中文表头稳定落到业务字段
开发语言·python·excel
空堂与归34 分钟前
AI 与 SI(超级智能):先分清窄智能与超级智能的边界
开发语言·人工智能·gpt
熊猫钓鱼>_>35 分钟前
Kotlin Multiplatform for OpenHarmony 实战:为 kotlin-inject 实现依赖注入适配
开发语言·华为·kotlin·ai编程·inject·鸿蒙·openharmony
Wang's Blog1 小时前
Java框架 SpringCloud 快速入门: 网关的 CORS 跨域配置
java·开发语言·spring cloud