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();                      //从暂停的地方恢复播放
相关推荐
码兄科技1 小时前
Java AI智能体开发实战:从零构建智能对话系统指南
java·开发语言·人工智能
Drone_xjw2 小时前
从 GDB 到 CDB:C/C++ 程序调试的两把“手术刀”
c语言·开发语言·c++
SL-staff3 小时前
智慧园区2000+设备统一管理:JVS-IoT如何降低运维成本40%
java·开发语言·物联网·智慧园区·设备管理·运维优化·jvs-iot
2zcode5 小时前
基于MATLAB图像处理的饮料瓶灌装液位检测系统设计与实现
开发语言·图像处理·matlab
必须得开心呀6 小时前
QT解决中文乱码问题
开发语言·qt
Jackson__6 小时前
为了拯救我的腰椎和颈椎,我做了款浏览器插件!
前端·javascript·开源
林小帅6 小时前
NestJS v11 + Prisma v7 ESM 迁移配置解析
前端·javascript·后端
这不小天嘛7 小时前
JAVA八股——redis篇
java·开发语言·redis
Hilaku8 小时前
为什么你的大文件断点续传,一遇到弱网就崩溃?
前端·javascript·程序员
逝水无殇8 小时前
C# 字符串(String)详解
开发语言·后端·c#