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();                      //从暂停的地方恢复播放
相关推荐
cdg==吃蛋糕15 分钟前
selenium 使用方法
开发语言·python
爱掉发的小李1 小时前
前端开发中的输出问题
开发语言·前端·javascript
zyx没烦恼1 小时前
五种IO模型
开发语言·c++
Dolphin_海豚1 小时前
一文理清 node.js 模块查找策略
javascript·后端·前端工程化
Q_Q5110082852 小时前
python的婚纱影楼管理系统
开发语言·spring boot·python·django·flask·node.js·php
EutoCool2 小时前
Qt窗口:菜单栏
开发语言·c++·嵌入式硬件·qt·前端框架
nightunderblackcat2 小时前
新手向:使用Python将多种图像格式统一转换为JPG
开发语言·python
我爱Jack3 小时前
深入解析 LinkedList
java·开发语言
engchina3 小时前
Python PDF处理库深度对比:PyMuPDF、pypdfium2、pdfplumber、pdfminer的关系与区别
开发语言·python·pdf
拓端研究室3 小时前
专题:2025供应链数智化与效率提升报告|附100+份报告PDF、原数据表汇总下载
开发语言·php