← Back to rules

vue/no-deprecated-props-default-this Correctness

🚧 An auto-fix is planned for this rule, but not implemented at this time.

What it does

Disallow deprecated this access in props default function (in Vue.js 3.0.0+).

Why is this bad?

In Vue.js 3.0.0+, props default factory functions no longer have access to this. They are invoked before the component instance is created, so this is undefined. The factory should rely on its first argument (the raw props passed by the parent) instead.

Examples

Examples of incorrect code for this rule:

<script>
export default {
  props: {
    a: String,
    b: {
      default() {
        return this.a;
      },
    },
  },
};
</script>

Examples of correct code for this rule:

<script>
export default {
  props: {
    a: String,
    b: {
      default(props) {
        return props.a;
      },
    },
  },
};
</script>

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/no-deprecated-props-default-this": "error"
  }
}

Config (oxlint.config.ts)

import { defineConfig } from "oxlint";

export default defineConfig({
  plugins: ["vue"],
  rules: {
    "vue/no-deprecated-props-default-this": "error",
  },
});

CLI

oxlint --deny vue/no-deprecated-props-default-this --vue-plugin

Version

This rule was added in vnext.

References

• Rule Source
• Open rule in Oxc Playground