vue面试系列(10) vue如何动态加载组件？

简单的事例

<template>
<div id="app">
<!-- vue.js提供了一个特殊元素 component 用来动态挂载组件 使用is特性来选择挂载的组件-->
<component :is="currentName"></component>

<!-- 这块可以根据自己的条件去切换 -->
<button @click="currentThis('A')">切换到A</button>
<button @click="currentThis('B')">切换到B</button>
<button @click="currentThis('C')">切换到C</button>

</div>
</template>

<script>
import A from './components/A'
import B from './components/B'
import C from './components/C'
export default {
components:{
A,B,C
},
data(){
return{
currentName:'A'
}
},
methods:{
currentThis(m){
this.current = m
}
}
}
</script>