# vue/html-button-has-type

disallow usage of button without an explicit type attribute

  • ❗️ This rule has not been released yet.
  • ⚙️ This rule is included in "plugin:vue/recommended".

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.

<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>
Now loading...

# 🔧 Options

{
  "vue/html-button-has-type": ["error", {
    "button": true,
    "submit": true,
    "reset": true
  }]
}
  • button ... <button type="button"></button>
    • true (default) ... allow value button.
    • false" ... disallow value button.
  • sumbit ... <button type="sumbit"></button>
    • true (default) ... allow value submit.
    • false" ... disallow value submit.
  • reset ... <button type="reset"></button>
    • true (default) ... allow value reset.
    • false" ... disallow value reset.

# 🔍 Implementation