"is" attribute in Vuejs

Rather than using a custom element, you are using an existing HTML element (or Vue's generic component element) and is specifies which of your own components it should be rendered as.

You mean if I don't want to render component this way:

<my-component></my-component>

in a template, I can choose to render this way:

<component is="my-component"></component>

Correct?

<div is="my-component"></div>

is equal to

<my-component></my-component>

This is especially useful if you have dynamic components. So you want to load a specific type of component based on a condition. The documentation of vuejs has an example made for it:

• https://vuejs.org/v2/guide/components.html#Dynamic-Components
• The fiddle: https://jsfiddle.net/chrisvfritz/o3nycadu/

And another usecase is to prevent invalid html markup like with table rows: (copied from the vuejs docs)

<table>
  <blog-post-row></blog-post-row>
</table>

The custom component <blog-post-row> will be hoisted out as invalid content, causing errors in the eventual rendered output. Fortunately, the is special attribute offers a workaround:

<table>
  <tr is="blog-post-row"></tr>
</table>