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();                      //从暂停的地方恢复播放
相关推荐
仅此,6 分钟前
前端接收了id字段,发送给后端就变了
java·前端·javascript·spring·typescript
野生风长7 分钟前
从零开始的C语言:文件操作与数据存储(上)(文件的分类,文件的打开和关闭)
c语言·开发语言
樱桃园园长10 分钟前
【Three.js 实战】手势控制 3D 奢华圣诞树 —— 从粒子系统到交互实现
javascript·3d·交互
二狗哈17 分钟前
Cesium快速入门30:CMZL动画
javascript·3d·webgl·cesium·地图可视化
我是哈哈hh18 分钟前
【Python数据分析】数据可视化(全)
开发语言·python·信息可视化·数据挖掘·数据分析
拾贰_C21 分钟前
【python| pytorch】卸载py库,手动法
开发语言·pytorch·python
!停22 分钟前
数据在内存中的存储(2)
开发语言·c++·算法
龙山云仓22 分钟前
No098:黄道婆&AI:智能的工艺革新与技术传承
大数据·开发语言·人工智能·python·机器学习
是喵斯特ya26 分钟前
python开发web暴力破解工具(基础篇)
开发语言·python·web安全
Legendary_00828 分钟前
Type-C一拖三快充线的核心优势与LDR6020方案深度解析
c语言·开发语言·电脑