最近2018中文字幕在日韩欧美国产成人片_国产日韩精品一区二区在线_在线观看成年美女黄网色视频_国产精品一区三区五区_国产精彩刺激乱对白_看黄色黄大色黄片免费_人人超碰自拍cao_国产高清av在线_亚洲精品电影av_日韩美女尤物视频网站

這篇文章主要介紹“Vue如何實(shí)現(xiàn)語音播報(bào)”，在日常操作中，相信很多人在Vue如何實(shí)現(xiàn)語音播報(bào)問題上存在疑惑，小編查閱了各式資料，整理出簡(jiǎn)單好用的操作方法，希望對(duì)大家解答”Vue如何實(shí)現(xiàn)語音播報(bào)”的疑惑有所幫助！接下來，請(qǐng)跟著小編一起來學(xué)習(xí)吧！

為工布江達(dá)等地區(qū)用戶提供了全套網(wǎng)頁(yè)設(shè)計(jì)制作服務(wù)，及工布江達(dá)網(wǎng)站建設(shè)行業(yè)解決方案。主營(yíng)業(yè)務(wù)為網(wǎng)站制作、網(wǎng)站設(shè)計(jì)、工布江達(dá)網(wǎng)站設(shè)計(jì)，以傳統(tǒng)方式定制建設(shè)網(wǎng)站，并提供域名空間備案等一條龍服務(wù)，秉承以專業(yè)、用心的態(tài)度為用戶提供真誠(chéng)的服務(wù)。我們深信只要達(dá)到每一位用戶的要求，就會(huì)得到認(rèn)可，從而選擇與我們長(zhǎng)期合作。這樣，我們也可以走得更遠(yuǎn)！

Vue中使用speak-tts插件實(shí)現(xiàn)點(diǎn)擊按鈕后進(jìn)行語音播報(bào)(TTS/文字轉(zhuǎn)語音)

場(chǎng)景

speak-tts插件

實(shí)現(xiàn)點(diǎn)擊按鈕觸發(fā)語音播報(bào)，播報(bào)指定的文字內(nèi)容。

為什么不能實(shí)現(xiàn)自動(dòng)語音播報(bào)。

chrome瀏覽器在18年4月起，就在桌面瀏覽器全面禁止了音視頻的自動(dòng)播放功能。

嚴(yán)格地來說，是Chrome不允許在用戶對(duì)網(wǎng)頁(yè)進(jìn)行觸發(fā)之前播放音頻。

不光是這樣，在頁(yè)面加載完畢的情況下，用戶沒有click、dbclick、touch等主動(dòng)交互行為，

使用js直接調(diào)用.play() 方法的話，chrome都會(huì)拋出如下錯(cuò)誤：Uncaught (in promise) DOMException；

實(shí)現(xiàn)

1、參考官方說明安裝依賴

npm install speak-tts

2、在頁(yè)面中引入

import Speech from 'speak-tts'

3、聲明speech對(duì)象

  data() {    return {
     speech: null,
   };

4、頁(yè)面加載完調(diào)用初始化方法

mounted() {
    this.speechInit();
  },
  methods: {
    speechInit() {
      this.speech = new Speech();
      this.speech.setLanguage("zh-CN");
      this.speech.init().then(() => {});
    },

5、頁(yè)面添加按鈕

speak-tts語音播報(bào)

6、按鈕點(diǎn)擊事件中調(diào)用播放方法

    speakTtsSpeech() {      this.speech.speak({ text: "公眾號(hào):霸道的程序猿" }).then(() => {
       console.log("讀取成功");
     });
   },

7、完整示例代碼

到此，關(guān)于“Vue如何實(shí)現(xiàn)語音播報(bào)”的學(xué)習(xí)就結(jié)束了，希望能夠解決大家的疑惑。理論與實(shí)踐的搭配能更好的幫助大家學(xué)習(xí)，快去試試吧！若想繼續(xù)學(xué)習(xí)更多相關(guān)知識(shí)，請(qǐng)繼續(xù)關(guān)注創(chuàng)新互聯(lián)網(wǎng)站，小編會(huì)繼續(xù)努力為大家?guī)砀鄬?shí)用的文章！
            
            
                                                            

                                                本文標(biāo)題：Vue如何實(shí)現(xiàn)語音播報(bào)                                                

                                                分享地址：http://fisionsoft.com.cn/article/pgdghh.html