← Back to rules

vue/next-tick-style Style

🛠️ An auto-fix is available for this rule.

What it does

Enforce Promise or callback style in nextTick.

Why is this bad?

In Vue.js, nextTick can be used either by passing a callback or by using the returned Promise. Mixing these styles makes the code harder to read and inconsistent. Choose one style consistently.

Examples

Examples of incorrect code for this rule with default "promise" option:

this.$nextTick(() => {});
Vue.nextTick(() => {});
import { nextTick } from "vue";
nextTick(() => {});

Examples of correct code for this rule with default "promise" option:

this.$nextTick().then(() => {});
await Vue.nextTick();
import { nextTick } from "vue";
await nextTick();

Examples of incorrect code for this rule with "callback" option:

await this.$nextTick();
Vue.nextTick().then(() => {});

Examples of correct code for this rule with "callback" option:

this.$nextTick(() => {});
Vue.nextTick(() => {});

Configuration

This rule accepts one of the following string values:

"promise"

Require using the Promise returned by nextTick.

"callback"

Require passing a callback function to nextTick.

How to use

To enable this rule using the config file or in the CLI, you can use:

Config (.oxlintrc.json)

{
  "plugins": ["vue"],
  "rules": {
    "vue/next-tick-style": "error"
  }
}

Config (oxlint.config.ts)

import { defineConfig } from "oxlint";

export default defineConfig({
  plugins: ["vue"],
  rules: {
    "vue/next-tick-style": "error",
  },
});

CLI

oxlint --deny vue/next-tick-style --vue-plugin

Version

This rule was added in vnext.

References

• Rule Source
• Upstream rule docs
• Open rule in Oxc Playground