vue中is的屬性引入是為了解決dom結構中對放入html的元素有限制的問題，譬如ul里面要接上li的標簽，引入is的屬性后，你完全可以寫成這樣

這樣會保證dom結構在瀏覽器的正常渲染，盡量避免在不正確的結構中直接使用組件

Vue.component('row', {

template: '

this is a row'

})

或另一種用法如圖：

動態組件與v-once指令

change

Vue.component("childOne", {

template: "

child one"

});

Vue.component("childTwo", {

template: "

child two"

});

var vm = new Vue({

el:"#app",

data: {

type: "child-one"

},

methods: {

handleBtnClick: function(){

this.type = (this.type==="child-one" ? "child-two" : "child-one")

}

}

})

補充知識：vue如何從外部修改組件內部的變量的值

1、首先是如何給你定義的變量拿到數據：

這里我自己用的是vuex：

首先在你項目的src文件夾下創建這么一個目錄：

之后就要在index.js中將homedatas.js(拿數據的js)共享出去，使頁面能拿到數據，

以下是index.js的代碼：

隨后就是在homedatas中獲取數據了，以下是homedatas.js代碼：

以上就是獲取數據的步驟，之后就是在頁面中拿到這個獲取到的數據：

首當其沖不可少的就是引用，引用vuex和引用組件：

之后在頁面的jascript中的export default中定義組件，獲取數據：

用這個方式在頁面中引用組件，然后再自定義標簽中將數據傳遞給組件：

2、子組件中獲取父組件傳遞過來的數據：

props中定義屬性，這是之前在頁面自定義標簽中設置的三個屬性，分別控制組件中的不同部分，定義每個屬性的類型、默認值以及測試函數，注意，測試函數一定要return一個值，不然頁面會報錯，測試函數的參數就是傳遞過來的值：

scrolldatas是一個數組，之后便是循環遍歷這個數組中的元素，數組中的值就能展示在頁面了，頁面元素會隨著數組元素的改變而改變：

之后就是其他兩個變量怎么在組建中引用了：

首先我要在測試函數中判斷一下，這個傳進來的值符合不符合要求，如果不符合，那就不執行測試函數，就是默認值，如果符合要求，執行函數，并在函數中改變默認值，賦值給相應自定義變量：

之后就是調用函數，調用函數中傳入參數，這個參數現在的值不是最開始var的初始值，而是后來測試函數中因為符合測試函數的條件后來賦給的值(因為window.onload直到頁面加載才會執行)：

之后就要在需要用到這個變量的函數中傳一個參數(speed，這個speed的值就是上面changespeed的值):

所以經過一會說那個的操作，只要在獲取數據的地方修改值，頁面效果就會隨之改變，不需要再組件中修改任何東西：

以上這篇vue組件講解(is屬性的用法)模板標簽替換操作就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持我們。

時間： 2020-09-02

總結

以上是生活随笔為你收集整理的is属性用法 vue_vue组件讲解(is属性的用法)模板标签替换操作的全部內容，希望文章能夠幫你解決所遇到的問題。

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