轉自https://segmentfault.com/a/1190000017262264?utm_source=tag-newest
配合is還有一個項目：
https://github.com/woai3c/visual-drag-demo
https://woai3c.github.io/visual-drag-demo/#/
https://mp.weixin.qq.com/s/-_FklC_z8YhiZ-QYHCf6zA
https://mp.weixin.qq.com/s/kjMimj_jKnusxMgvBRHw2Q

is的作用

 <ul>
  <li></li>
  <li></li>
  <li></li>
</ul>

總所周知，ul里面嵌套li的寫法是html語法的固定寫法（還有如table,select等）。

//code1
<ul>
  <my-component></my-component>
  <my-component></my-component>
</ul>

my-component是我們自己寫的組件，但是html在渲染dom的時候，my-component對ul來說并不是有效的dom，甚至會報錯。

is的誕生

正是因為html模板的限制，于是就誕生了is。接下來我們就用is解決上面的問題~

<ul>
  <li is='my-component'></li>
</ul>

首先你得注冊my-component組件，全局或者局部都成。 <li is='my-component'></li>其實就相當于<my-component></my-component>，語義上是一樣一樣的，就是解決了html模板的限制。

is的用法

<component> + is 的騷操作

<!-- 組件會在 `件名` 改變時改變 -->
<component :is="組件名變量"></component>

只要在data里弄個變量，給變量賦值就能動態(tài)的切換組件。這個其實在某些場景還是非常好用的安利一下。

不受html模板限制的情況

vue官網提醒以下來源使用模板的話，這條限制是不存在的：
字符串 (例如：template: '...')
單文件組件 (.vue)
<script type="text/x-template">
也就是說只有在用cdn方式寫vue的時候才會出現(xiàn)這種問題？開發(fā)基本用框架，好像沒啥事的樣子。
哈哈哈~到此結束，祝你生活愉快