HTML
<input type="button" @click="showchild" value="show"> //點擊按鈕后帖努,show為真,先獲取child組件,再渲染div內容
<div id="contain" v-if="show">
<child></child>
</div>
JS
data () {
return {
msg: 'Welcome to Your Vue.js App',
show:false
}
},
methods: {
showchild:function(){
this.show=true;
}
},
components: {
'child': function(resolve) {
require(['./components/child.vue'], resolve);
}
}
注意:加載異步組件的時候荞怒,組件名后邊的.vue不要忽略。這個例子應該比較直觀了秧秉。點擊按鈕之后改變了變量show的布爾值為真褐桌,由于child.vue是異步組件,所以會先ajax獲取組件然后渲染象迎。