JS.VUE.REQUIRE.COMPONENT.IS

Require 'v-bind:is' of '<component>' elements

Rule Details

This rule reports the <component> elements which do not have v-bind:is attributes.

{'vue/require-component-is': ['error']}

Copy
<template>
  <!-- GOOD -->
  <component :is="type"/>
  <component v-bind:is="type"/>

  <!-- BAD -->
  <component/>
  <component is="type"/>
</template>

You can use the same mount point and dynamically switch between multiple components using the reserved <component> element and dynamically bind to its is attribute.

Options

Nothing.

Further Reading

  • Guide - Components Basics / Dynamic Components (https://v3.vuejs.org/guide/component-basics.html#dynamic-components)

The content on this page is adapted from the ESLint User Guide. Copyright © OpenJS Foundation and other contributors, www.openjsf.org. All rights reserved. https://eslint.org/docs/rules/