Javascript 如何在按钮@click[VUE JS]上连续调用函数

我在@click上调用了3个函数，我是这样做的：

<CButton
  @click=" getBillPrice();
           updateBill();
           postData();"
  type="submit"
  color="primary">Save</CButton>

---

我认为，与其将每个函数都放在click事件上，不如创建一个函数来触发这些函数

<CButton
  @click="onSubmit"
  color="primary">Save</CButton>

如果您的函数是异步的，那么您可以使用AsyncWait和TryCatch

methods: {
  async onSubmit(){
    try{
      await this.getBillPrice();
      await this.updateBill();
      this.postData()
    } catch(err){
      // Handle error.
    }

  },
  ...
}

由于您的项目中似乎不支持async await，所以您可以尝试这样做。（我在then catch方面没有那么多经验，但它应该会起作用）

---

谢谢您的回答，但我收到以下错误：[Vue warn]：v-on处理程序中的错误：“ReferenceError:regeneratorRuntime未定义”在-->中找到src/views/layout/CreateItem.vue中的src/containers/TheContainer.vue中的src/App.vue引用错误：在HtmlButtoneElement.invoker中的调用错误处理（vue.esm.js？a026:1863）中的VueComponent.onSubmit（CreateItem.vue？bada:224）中未定义regeneratorRuntime（vue.esm.js？a026:2184）在HTMLButtonElement.original._包装（vue.esm.js？a026:7565）哦，我想在你的Vuejs项目中不支持异步等待，我想你还没有安装babel。请检查一下，现在我有一个错误：[vue warn]：v-on处理程序中的错误：“类型错误：无法读取未定义的'then'属性”在-->中找到src/views/layout/CreateItem.vue中的src/containers/TheContainer.vue中的src/App.vue让我们看看。

methods: {
  onSubmit(){
    this.getBillPrice();
    this.updateBill();
    this.postData()
  },
  ...
}

methods: {
  async onSubmit(){
    try{
      await this.getBillPrice();
      await this.updateBill();
      this.postData()
    } catch(err){
      // Handle error.
    }

  },
  ...
}

methods: {
  onSubmit(){
    this.getBillPrice()
    .then(() => {
       return this.updateBill()
    })
    .then(() => {
       return this.postData()
    })
    .then(() => {
       // Any other code if needed
    })
    .catch((err) => {
       // Handle error scenario
    })

  },
  ...
}