v-is
directives JS-0661When using in-DOM templates, the template is subject to native HTML parsing rules.
Some HTML elements, such as <ul>
, <ol>
, <table>
and <select>
have restrictions on what elements can appear inside them, and some elements such as <li>
, <tr>
, and <option>
can only appear inside certain other elements.
As a workaround, we can use the v-is
directive on these elements.
v-is
directive is not valid in following cases:
- The directive has that argument.
- The directive has that modifier.
- The directive does not have that attribute value.
- The directive is on Vue-components.
<tr v-is:a="foo"></tr>
<tr v-is.m="foo"></tr>
<tr v-is></tr>
<tr v-is=""></tr>
<MyComponent v-is="foo" />
<tr v-is="'blog-post-row'"></tr>
<tr v-is="foo"></tr>