对于字符串模板的概念,在vue官方文档中的组件中提到这样一段文字:

  当使用 DOM 作为模版时 (例如,将 el 选项挂载到一个已存在的元素上), 你会受到 HTML 的一些限制,因为 Vue 只有在浏览器解析和标准化 HTML 后才能获取模版内容。尤其像这些元素 <ul>,<ol>,<table>,<select> 限制了能被它包裹的元素,而一些像 <option> 这样的元素只能出现在某些其它元素内部。

在自定义组件中使用这些受限制的元素时会导致一些问题,例如:

<table>
  <my-row>...</my-row>
</table>

自定义组件 被认为是无效的内容,因此在渲染的时候会导致错误。变通的方案是使用特殊的 is 属性:

<table>
  <tr is="my-row"></tr>
</table>

应当注意,如果您使用来自以下来源之一的字符串模板,这些限制将不适用:

<script type="text/x-template">
JavaScript 内联模版字符串
.vue 组件

因此,有必要的话请使用字符串模版。

什么是字符串模板呢?在此我不做具体说明,我想引用几处文档作为参照:

张鑫旭的博客:
http://www.zhangxinxu.com/wordpress/2014/07/hello-html5-template-tag/

360个DOC人图书馆:
http://www.360doc.com/content/14/1212/11/9200790_432350281.shtml

知乎:
https://www.zhihu.com/question/23067588

Logo

前往低代码交流专区

更多推荐