Vue2：动态组件

动态组件

要实现不同组件之间进行动态切换，这时候除了条件渲染，还可以使用动态组件

component 标签的 is属性语法：

is后跟组件的变量名决定使用哪个组件来渲染

<component is="Sinabox"></component>==><Sinabox/>

<component v-bind:is="mycomponent"></component>

 

注意: is是组件名　　:is是data中的变量中保存的组件名

 

<template>
  <div id="app">
     <components is="com1"></components>
     <components v-bind:is="com2"></components>
  </div>
</template>

<script>
import com1from './components/com1.vue'
import HelloWorld2 from './components/HelloWorld2.vue'
export default {
  name: 'app',
  data(){return{
      flag:true,
      com2:"HelloWorld",
  
  }},
  components: {
    HelloWorld,
    com1,
  },
}
</script>