Parsing error: await is a reserved word [How to Solve]

Problem: the error message is that a red wavy line appears in the editing of vscade. When the mouse is placed, it will prompt: parsing error: await is a reserved word. Parsing error: await is a reserved word, indicating that the editor does not recognize it and takes it as a keyword

Because an async keyword is added to the function outside the form verification, you want to write synchronization code in the callback function, but an error is reported.

// save
async save() {
  this.$refs.form.validateForm((valid) => {
    if (valid) {
      // The purpose of adding await is to wait for the save to complete before refreshing the list
      await /* this async reports an error */ this.saveRecord()
      this.$emit('closeModal')
      this.reset()
    }
  })
}

After modification:

save() {
// The async should be defined in front of the callback function (anonymous function) at this point.
// The external function and the callback function form two separate scopes.
// The function defined externally and the callback function form two block scopes,
// At this point, await and aysnc are not in the same scope, so they cannot be paired and an error is reported
 this.$refs.form.validateForm(async (valid) => {
   if (valid) {
   	 // The purpose of adding await is to wait for the save to complete before refreshing the list
     await /* No error is reported here for async */ this.saveRecord()
     this.$emit('closeModal')
     this.reset()
   }
 })
}

Summary: if you want to write synchronization code inside the callback function, you need to put the async keyword in front of the callback function to make async and await in the same scope


Read More: