版权声明：本文为CSDN博主「liuguochao1024」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。

原文链接：https://blog.csdn.net/liuguochao1024/article/details/89499785

<template>
  <div>
    <div>
      <input id="ttsText" type="text">
      <input id="tts_btn" type="button" value="播放" @click="myplay()">
    </div>
    <div id="bdtts_div_id">
      <audio id="tts_autio_id" autoplay="autoplay">
        <source id="tts_source_id" src="http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=9&text= " type="audio/mpeg">
        <embed id="tts_embed_id" height="0" width="0" src="">
      </audio>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Test',
  data() {
    return {

    }
  },
  methods: {
    myplay() {
      var ttsDiv = document.getElementById('bdtts_div_id')
      var ttsAudio = document.getElementById('tts_autio_id')
      var ttsText = document.getElementById('ttsText').value
      ttsDiv.removeChild(ttsAudio)
      var au1 = '<audio id="tts_autio_id" autoplay="autoplay">'
      var sss = '<source id="tts_source_id" src="http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=2&text=' + ttsText + '" type="audio/mpeg">'
      var eee = '<embed id="tts_embed_id" height="0" width="0" src="">'
      var au2 = '</audio>'
      ttsDiv.innerHTML = au1 + sss + eee + au2
      ttsAudio = document.getElementById('tts_autio_id')
      ttsAudio.play()
    }
  }
}
</script>

---