此文首發于 https://lijing0906.github.io/

最近，工作之余在翻閱vue.js的官方文檔，在查看到動態組件和解析 DOM 模板時的注意事項的時候，講到一個特殊的is特性，覺得很有意思，就來寫一篇自己理解的總結。

現場

寫栗子實踐

其實看過之后，其實是有點懵的，這兩個有啥區別，怎么用呢？

仔細分析，沒那么難懂，參考這篇博客，我們也寫一個栗子來試試

我們平時用局部注冊的情況更多些，那我就寫一個局部注冊組件的栗子。

替換部分內容看渲染結果

單獨看自定義組件componentA，把is="componentA"改成is="componentB"，會發現這部分的內容由原來的組件componentA的內容變成了componentB的內容

這里我們會發現，雖然標簽是< componetA>,但是沒有顯示componentA的內容，而是顯示componentB的內容，說明vue在渲染組件的內容時，是有檢測is特性的，如果有被賦值那就渲染該值對應的組件的內容，如果沒有is特性，那就渲染標簽對應的組件內容。 那么如果把< componetA>換成< div>、< p>等等符合W3C的標簽都能正常顯示is被賦值的組件的內容！這樣就與解析 DOM 模板時的注意事項不謀而合了！

單獨看自定義組件componentB，在父組件中能看到，是：is,這是數據綁定，那么被綁定的值必須在當前實例的data中定義。栗子中綁定的是two，two的值是什么那componentB就渲染什么。

同樣，如果把< componetB>換成< div>、< p>等等符合W3C的標簽都能正常顯示：is被賦值的組件的內容！這樣就是動態組件了！

最后

舉栗子實踐分析了一番，總算明白了一些，總結一下：

• 相同點：都能實現動態組件的效果
• 不同點：：is是數據綁定，綁定的值必須在data中定義，is被賦值的值須是子組件的名稱

總結

以上是生活随笔為你收集整理的vue2.0中的：is和is的区别的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。