useVueValidVOnce

HTML

Summary

Rule available since: v2.3.11
Diagnostic Category: lint/correctness/useVueValidVOnce
This rule is recommended, meaning it is enabled by default.
This rule has an unsafe fix.
The default severity of this rule is error.
This rule belongs to the following domains:
- vue
Sources:
- Same as vue/valid-v-once

How to configure

1
{
2
  "linter": {
3
    "rules": {
4
      "correctness": {
5
        "useVueValidVOnce": "error"
6
      }
7
    }
8
  }
9
}

Description

Enforce valid v-once Vue directives.

Examples

Invalid

This rule reports v-once directives in the following cases:

The directive has an argument so it is invalid.

1
<div v-once:arg></div>

code-block.vue:1:12 lint/correctness/useVueValidVOnce  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ The v-once directive must not have an argument.
  
  > 1 │ <div v-once:arg></div>
      │            ^^^^
    2 │ 
  
  ℹ Use v-once without arguments, e.g. v-once.
  
  ℹ Unsafe fix: Remove the argument.
  
    1 │ <div·v-once:arg></div>
      │            ----

The directive has a modifier so it is invalid.

1
<div v-once.mod></div>

code-block.vue:1:12 lint/correctness/useVueValidVOnce  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ The v-once directive does not support modifiers.
  
  > 1 │ <div v-once.mod></div>
      │            ^^^^
    2 │ 
  
  ℹ Remove the modifier; v-once is a stand-alone control directive.
  
  ℹ Unsafe fix: Remove the modifier.
  
    1 │ <div·v-once.mod></div>
      │            ----

The directive has a value so it is invalid.

1
<div v-once="value"></div>

code-block.vue:1:12 lint/correctness/useVueValidVOnce  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ The v-once directive must not have a value.
  
  > 1 │ <div v-once=“value”></div>
      │            ^^^^^^^^
    2 │ 
  
  ℹ v-once is a boolean-like directive and should be used without a value.
  
  ℹ Unsafe fix: Remove the value.
  
    1 │ <div·v-once=“value”></div>
      │            --------

Valid

1
<div v-once></div>