useVueEmitsValidatorReturn (JavaScript)

Language JavaScript (and super languages)

Summary

Rule available since: v2.6.5
Diagnostic Category: lint/nursery/useVueEmitsValidatorReturn
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/return-in-emits-validator

How to configure

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

Description

Require the validator function of a Vue event to return a true value when the event is valid.

A component can check the values it passes along with an event by giving the event a validator function in the emits option or in defineEmits(). Vue calls the validator each time the event is emitted. When the validator doesn’t return a true value, Vue prints a warning in development mode.

A validator that never returns a value, or that only returns values such as false, 0, "", null or undefined, makes Vue print that warning every time the event is emitted, even when its values are correct. This is usually a mistake, such as a forgotten return.

The rule reports a validator when none of its return statements can return a true value. A return statement inside another function written in the validator doesn’t count.

Examples

Invalid

1
<script>
2
export default {
3
  emits: {
4
    submit(payload) {
5
      payload.email.includes("@");
6
    },
7
  },
8
};
9
</script>

code-block.vue:4:5 lint/nursery/useVueEmitsValidatorReturn ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ The validator of the event submit never returns a value.
  
    2 │ export default {
    3 │   emits: {
  > 4 │     submit(payload) {
      │     ^^^^^^^^^^^^^^^^^
  > 5 │       payload.email.includes("@");
  > 6 │     },
      │     ^
    7 │   },
    8 │ };
  
  ℹ Vue prints a warning in development mode each time the event is emitted, because the validator never accepts its values.
  
  ℹ Return true when the values of the event are valid, and false otherwise.
  
  ℹ This rule belongs to the nursery group, which means it is not yet stable and may change in the future. Visit https://biomejs.dev/linter/#nursery for more information.

1
<script setup>
2
defineEmits({
3
  close: () => false,
4
});
5
</script>

code-block.vue:3:10 lint/nursery/useVueEmitsValidatorReturn ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ The validator of the event close never returns a true value.
  
    1 │ <script setup>
    2 │ defineEmits({
  > 3 │   close: () => false,
      │          ^^^^^^^^^^^
    4 │ });
    5 │ </script>
  
  ℹ Vue prints a warning in development mode each time the event is emitted, because the validator never accepts its values.
  
  ℹ Return true when the values of the event are valid, and false otherwise.
  
  ℹ This rule belongs to the nursery group, which means it is not yet stable and may change in the future. Visit https://biomejs.dev/linter/#nursery for more information.

Valid

1
<script setup>
2
defineEmits({
3
  submit(payload) {
4
    return payload.email.includes("@");
5
  },
6
  select(id) {
7
    if (typeof id !== "number") {
8
      return false;
9
    }
10
    return true;
11
  },
12
  close: null,
13
});
14
</script>