Skip to content

Rule proposal: vue/no-deprecated-model-definition #2236

Closed
@FloEdelmann

Description

@FloEdelmann

Please describe what the rule should do:

In Vue 3, v-model is always a shortcut for :modelValue="…" @update:modelValue="…". In Vue 2, those prop and event names could be customized with the model definition. A new ESLint rule would help with finding those deprecated model definitions in the codebase while upgrading to Vue 3. See also https://v3-migration.vuejs.org/breaking-changes/v-model.html

What category should the rule belong to?
[ ] Enforces code style (layout)
[x] Warns about a potential error (problem)
[ ] Suggests an alternate way of doing something (suggestion)
[ ] Other (please specify:)

Provide 2-3 code examples that this rule should warn about:

export default {
  model: {
    prop: 'list',
  }
}
export default defineComponent({
  model: {
    prop: 'list',
    event: 'update'
  }
})
export default Vue.extend({
  model: {
    event: 'update'
  }
})

Additional context
An additional allowVue3Compat boolean option (false by default) could help with transitioning to Vue 3:

When enabled, the rule would not report model definitions that match the Vue 3 usage:

export default defineComponent({
  model: {
    prop: 'foo-bar',
    event: 'update:foo-bar'
  }
})

After the Vue 3 migration, the option could be disabled again, the model definition could be deleted, and the v-model:foo="…" shorthand syntax could then be used without further changes.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions