Skip to content

vue/no-async-in-computed-properties

disallow asynchronous actions in computed properties

  • ⚙️ This rule is included in the following preset configs:
    • *.configs["flat/essential"]
    • *.configs["flat/vue2-essential"]
    • *.configs["flat/strongly-recommended"]
    • *.configs["flat/vue2-strongly-recommended"]
    • *.configs["flat/recommended"]
    • *.configs["flat/vue2-recommended"]
    • "plugin:vue/essential"
    • "plugin:vue/vue2-essential"
    • "plugin:vue/strongly-recommended"
    • "plugin:vue/vue2-strongly-recommended"
    • "plugin:vue/recommended"
    • "plugin:vue/vue2-recommended"

Computed properties and functions should be synchronous. Asynchronous actions inside them may not work as expected and can lead to unexpected behaviour; that's why you should avoid them. If you need async computed properties, consider using the computedAsync composable from VueUse.

📖 Rule Details

This rule is aimed at preventing asynchronous methods from being called in computed properties and functions.

Now loading...
Now loading...

🔧 Options

js
{
  "vue/no-async-in-computed-properties": ["error", {
    "ignoredObjectNames": []
  }]
}
  • ignoredObjectNames: An array of object names that should be ignored when used with promise-like methods (.then(), .catch(), .finally()). This is useful for validation libraries like Zod that use these method names for non-promise purposes (e.g. z.catch()).

"ignoredObjectNames": ["z"]

Now loading...

📚 Further Reading

🚀 Version

This rule was introduced in eslint-plugin-vue v3.8.0

🔍 Implementation