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();                      //从暂停的地方恢复播放
相关推荐
wregjru16 小时前
【网络】8.五种 I/O 模型与多路转接详解
开发语言·php
fff98111816 小时前
C++与Qt图形开发
开发语言·c++·算法
xht083216 小时前
PHP vs Python:编程语言终极对决
开发语言·python·php
计算机安禾16 小时前
【数据结构与算法】第3篇:C语言核心机制回顾(二):动态内存管理与typedef
c语言·开发语言·数据结构·c++·算法·链表·visual studio
23.16 小时前
【Java】char字符类型的UTF-16编码解析
java·开发语言·面试
无小道16 小时前
关于mmap的理解和使用
开发语言·mmap
竹林81816 小时前
从零到一:我在Solana NFT铸造前端中搞定@solana/web3.js连接与交易
前端·javascript
froginwe1116 小时前
jQuery 隐藏/显示详解
开发语言
尘世中一位迷途小书童16 小时前
前端工程化基石:package.json 40+ 字段逐一拆解
前端·javascript·架构
码云数智-大飞16 小时前
分布式数据库:2026年数据架构的基石与挑战
开发语言