vue/html-button-has-type
disallow usage of button without an explicit type attribute
Forgetting the type attribute on a button defaults it to being a submit type. This is nearly never what is intended, especially in your average one-page application.
📖 Rule Details
This rule aims to warn if no type or an invalid type is used on a button type attribute.
1
2
3
4
5
6
7
8
9
10
11
12
<template>
<!-- ✓ GOOD -->
<button type="button">Hello World</button>
<button type="submit">Hello World</button>
<button type="reset">Hello World</button>
<!-- ✗ BAD -->
<button>Hello World</button>
<button type="">Hello World</button>
<button type="foo">Hello World</button>
</template>
🔧 Options
json
{
"vue/html-button-has-type": ["error", {
"button": true,
"submit": true,
"reset": true
}]
}
button
...<button type="button"></button>
true
(default) ... allow valuebutton
.false
... disallow valuebutton
.
submit
...<button type="submit"></button>
true
(default) ... allow valuesubmit
.false
... disallow valuesubmit
.
reset
...<button type="reset"></button>
true
(default) ... allow valuereset
.false
... disallow valuereset
.
🚀 Version
This rule was introduced in eslint-plugin-vue v7.6.0