Skip to content

Rule suggestion: valid-v-for supports recognize native custom elements #2022

Open
@zheung

Description

@zheung

What rule do you want to change?
valid-v-for

Does this change cause the rule to produce more or fewer warnings?
Fewer.

How will the change be implemented? (New option, new default behavior, etc.)?

  • new option: isCustomElement as RegExp or Function

Please provide some example code that this change will affect:

<!-- BAD as default -->
<!-- report "Custom elements in iteration require 'v-bind:key' directives." -->
<my-component v-for="todo in todos" />

<!-- GOOD with option isCustomElement /^my-/ -->
<my-component v-for="todo in todos" />

What does the rule currently do for this code?
report according to function utils.isCustomComponent

What will the rule do after it's changed?
report according to function utils.isCustomComponent and isCustomElement option

Additional context

https://vuejs.org/guide/extras/web-components.html#skipping-component-resolution
https://vuejs.org/api/application.html#app-config-compileroptions-iscustomelement

According to the introduction of the above document,

By default, Vue will attempt to resolve a non-native HTML tag as a registered Vue component before falling back to rendering it as a custom element.

But Vue also supports skipping component resolution by specifying the compilerOptions.isCustomElement option.

With configuration options, native custom elements are identical to native common elements for Vue.

The current valid-for-v rule does not support recognizing native custom elements and then treats native custom elements as custom component reports requireKey messages. I don't think this should be reported.

Since I am just a user who has briefly reviewed the code. And this is a suggestion, not an implementation. I don't know if the proposed new option isCustomElement is named properly, and if it supports function types. I think adjustments should be made to the implementation :)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions