I am using VueJS/Nuxt and Vuex store, and I have the following method defined:

async UpdateData () {
  try {
    await this.$store.dispatch('updateMyData', this.data)
    successMsg({ message: 'Data updated successfully' })
  } catch (e) {
    errorMsg({ message: 'Some error' })
  }
}

The problem is that I have not yet created the action 'updateMyData', so in my console I see the error '[vuex] unknown action type: updateMyData'

However, still the successMsg() is executed and I get the message 'Data updated successfully'.

My assumption was that if await... fails, it will go to the catch block.

Can you please help with what is wrong with my code and how I can correct it.

I am using VueJS/Nuxt and Vuex store, and I have the following method defined:

async UpdateData () {
  try {
    await this.$store.dispatch('updateMyData', this.data)
    successMsg({ message: 'Data updated successfully' })
  } catch (e) {
    errorMsg({ message: 'Some error' })
  }
}

The problem is that I have not yet created the action 'updateMyData', so in my console I see the error '[vuex] unknown action type: updateMyData'

However, still the successMsg() is executed and I get the message 'Data updated successfully'.

My assumption was that if await... fails, it will go to the catch block.

Can you please help with what is wrong with my code and how I can correct it.

• javascript
• vue.js
• vuejs2
• nuxt.js

• Are you familiar with promises? await / async are basically a new syntax for using promises. If the promise version of this code doesn't fail, the await version will not either. – Sidney Commented Mar 10, 2018 at 4:24
• I have not used promises much. But looking at the above could why do you think it's not catching the error? – asanas Commented Mar 10, 2018 at 4:30
• @acdcjunior - did you read the question? namely, the statement directly under the code block. – Randy Casburn Commented Mar 10, 2018 at 4:51
• 1 No harm. All just trying help. So upvote my answer - because it is the best answer after all :-) – Randy Casburn Commented Mar 10, 2018 at 4:55

2 Answers 2

That error is not an actual promise error, it's a warning from Vuex, saying that the 'updateMyData' action hasn't been registered anywhere in your Vuex store. The message es from a simple console.log(/error/warn) instead of a throw or reject(), which is why it doesn't fail in your function here.

In the case of an await expression not returning a Promise object, it turns what is passed in into a "resolved promise". This simply means your undefined function is returned immediately as if it Resolved. Hence, it doesn't reject and the await doesn't throw.

If the value of the expression following the await operator is not a Promise, it's converted to a resolved Promise.

This es from here: https://developer.mozilla/en-US/docs/Web/JavaScript/Reference/Operators/await#Description