如何向按钮添加 TextToSpeech.talk("hi') 操作

Question

如何添加TextToSpeech.talk("hi");当按钮是 selected/pressed.

TextToSpeech.talk("Hello Beautiful World!");

当用户点击按钮时，应生成语音

TTS Github https://github.com/IonicaBizau/text-to-speech-js

import Vue from 'vue'
import App from './App.vue'
import BootstrapVue from 'bootstrap-vue'
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'

Vue.use(BootstrapVue)

Vue.config.productionTip = 

new Vue({
  render: h => h(App)
}).$mount('#app')

<template>
  <div id="app">
    <div>
      <b-button-group vertical>
        <button v-on:click="say('hi')">Say hi</button>
        <button v-on:click="say('what')">Say what</button>
      </b-button-group>
    </div>

  </div>
</template>

<script>
  export default {
    data() {
      return {

      }
    }
  }
</script>

<style>

</style>

Answer 1

您的 click 处理程序设置为调用一个名为 say 的本地方法，该方法接受一个字符串参数（待读）。你只需要在你的组件中 define that method 来调用 TextToSpeech.talk() 和那个字符串参数：

export default {
  // ...
  methods: {
    say(msg) {
      TextToSpeech.talk(msg);
    }
  }
}

但是，您随后会注意到 TextToSpeech 后端似乎已损坏，如 IonicaBizau/text-to-speech-js Issue #10 中所报告的那样。

demo of broken lib

如何向按钮添加 TextToSpeech.talk("hi') 操作

How to add TextToSpeech.talk("hi') action to a button

javascript

text-to-speech

vue.js

vue-component

vuejs2