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();                      //从暂停的地方恢复播放
相关推荐
Ai-_Man7 分钟前
ChatGPT还是不可以导出左侧所有对话,只能点进去单条内容导出,方法不对吗?
开发语言·javascript·人工智能·chatgpt·小程序·ecmascript
问天_观心10 分钟前
模型微调学习(二)
开发语言·人工智能·学习·语言模型·github
小羊没烦恼!11 分钟前
深入浅出SQL Server中的死锁
java·开发语言·前端·数据库·后端·spring·c#
白露与泡影12 分钟前
Java 面试八股文及答案整理 | 后端面试高频题(2026)
java·开发语言·面试
夜晚回家17 分钟前
Python 赋值运算符详解 | 从 = 到 +=,一张记账单讲清复合赋值
开发语言·python
miofly23 分钟前
GitHub 今日推荐|security-audit-skill:让编码代理自己审计漏洞还互相验证
javascript·开源·github
布莱克60526 分钟前
QtWidgets 与 QML:两大 UI 开发框架的全面对比
开发语言·c++·qt·ui·架构
এ慕ོ冬℘゜36 分钟前
es6理论总结
前端·javascript·es6
张伯毅36 分钟前
External Shuffle Service(spark3_shuffle):原理、配置与排障
java·开发语言·spark·yarn
geovindu1 小时前
rust: Template Method Pattern
开发语言·后端·设计模式·rust·行为模式·模板方法模