vue 页面文字转播放声音 (SpeechSynthesisUtterance)

在页面里播放需要的文字,感觉挺有意思的,以后可能会有用的地方,暂时记录一下吧!!!
一些参数的意思:
text – 要合成的文字内容,字符串。
lang – 使用的语言,字符串, 例如:“zh-cn”
voiceURI – 指定希望使用的声音和服务,字符串。
volume – 声音的音量,区间范围是0到1,默认是1。
rate – 语速,数值,默认值是1,范围是0.1到10,表示语速的倍数,例如2表示正常语速的两倍。
pitch – 表示说话的音高,数值,范围从0(最小)到2(最大)。默认值为1。

首先我们要在引入的地方写这一段代码

 **const synth = window.speechSynthesis;
    const msg = new SpeechSynthesisUtterance();**这两行代码是我们使用的;

其次在我们要在methods里写两个函数;

    /** 语音播报的函数*/
   handleSpeak(e){
     msg.text = e;
     msg.lang = 'zh-CN';
     msg.volume = '1';
     msg.rate = 1;
     msg.pitch = 1;
     synth.speak(msg);
   },
    /* * 语音停止  */
   handleStop(e){
       msg.text = e;
        msg.lang = 'zh-CN';
        synth.cancel(msg);
        }

然后我们就可以再需要的地方执行这个该函数了

/* 语音播放 */ 
   this.handleSpeak('你好,世界');

前端小白—的爬坑之路 ,如有不对之处请多指教

你可能感兴趣的:(vue 页面文字转播放声音 (SpeechSynthesisUtterance))