[Vuejs]-Vue data function syntax

2👍

You need to return the object – wrap your function in parentheses and simply return the object literal:

data: () => (
  {
    stripe: null,
    stripePK: stripePK,
    //All your other properties
  }
)

Alternatively, use the return statement:

data: () => {
  return {
    stripe: null,
    stripePK: stripePK
    //All your other properties
  }
}

2👍

The main reason for the error is caused because {} is interpreted as a code block and not as an object literal. If you see carefully, there is no red squiggly underline on the first stripe:null, property. Because, it is interpreted as a labeled statement.

This doesn’t throw an error:

{
  stripe: null
}

This throws an error saying Unexpected token :

{
  stripe: null,
  stripePK: "stripePK"
}

To fix your code, you need to either return from the function

data: () => {
  return {
    stripe: null,
    stripePK: stripePK,
    ...
  }
}

OR, implicitly return from the arrow function by wrapping the object literal in parentheses:

data: () => ({
  stripe: null,
  stripePK: stripePK,
  ...
})
👤adiga

Leave a comment