useVueValidVText

HTML

Summary

• Rule available since: v2.3.7
• Diagnostic Category: lint/correctness/useVueValidVText
• This rule is recommended, meaning it is enabled by default.
• This rule doesn’t have a fix.
• The default severity of this rule is error.
• This rule belongs to the following domains:
  • vue
• Sources:
  • Same as vue/valid-v-text

How to configure

biome.json

{
  "linter": {
    "rules": {
      "correctness": {
        "useVueValidVText": "error"
      }
    }
  }
}

Description

Enforce valid v-text Vue directives.

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

• The directive has an argument. E.g. <div v-text:aaa></div>
• The directive has any modifiers. E.g. <div v-text.bbb></div>
• The directive does not have a value. E.g. <div v-text></div>

Examples

Invalid

<div v-text />

code-block.vue:1:6 lint/correctness/useVueValidVText ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ The v-text directive is missing a value.
  
  > 1 │ <div v-text />
      │      ^^^^^^
    2 │ 
  
  ℹ v-text directives require a value containing the text content to render.
  
  ℹ For example, use v-text=“foo” to render the content of the foo variable.
  

<div v-text:aaa="foo"></div>

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

  ✖ The v-text directive does not accept an argument.
  
  > 1 │ <div v-text:aaa=“foo”></div>
      │            ^^^^
    2 │ 
  
  ℹ v-text directives should be used without arguments, like v-text=“content”.
  

<div v-text.bbb="foo"></div>

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

  ✖ The v-text directive does not support modifiers.
  
  > 1 │ <div v-text.bbb=“foo”></div>
      │            ^^^^
    2 │ 
  
  ℹ v-text directives do not support any modifiers. Remove the modifier.
  

Valid

<div v-text="foo" />

Related links

• Disable a rule
• Configure the code fix
• Rule options
• Source Code (Edit this Page)
• Test Cases