一、實現(xiàn)兩個組件間互相展示、互相隱藏

<!DOCTYPE html>
<html>
<head>
<title>動態(tài)組件</title>
<script type="text/javascript" src="./vue-dev.js"></script>
</head>
<body>
<div id="app">
<child-one v-if="type=='child-one'" content="child-one"></child-one>
<child-two v-if="type=='child-two'" content="child-two"></child-two>
<button @click="handleChangeEvent">change</button>
</div>
<script type="text/javascript">
Vue.component('child-one', {
props: ["content"],
template: `<div>{{content}}</div>`,
});
Vue.component('child-two', {
props: ["content"],
template: `<div>{{content}}</div>`,
})
var vm = new Vue({
el: '#app',
data(){
return{
type:'child-one'
}
},
methods:{
handleChangeEvent:function(){
this.type= this.type=="child-one" ? 'child-two':'child-one';
}
}
})
</script>
</body>
</html>另外有需要云服務器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內(nèi)外云服務器15元起步,三天無理由+7*72小時售后在線,公司持有idc許可證,提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡單易用、服務可用性高、性價比高”等特點與優(yōu)勢,專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應用場景需求。
新聞名稱:Vue動態(tài)組件components和v-once指令的實現(xiàn)-創(chuàng)新互聯(lián)
當前URL:http://www.chinadenli.net/article48/iegep.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供定制網(wǎng)站、網(wǎng)站策劃、用戶體驗、網(wǎng)站設(shè)計、關(guān)鍵詞優(yōu)化、小程序開發(fā)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容