Vue动态组件

动态组件

1.什么是动态组件

动态组件就是控制动态组件的显示和隐藏

2.实现组件的动态渲染

2.1.首先先确定要渲染的组件是哪个组件，那必须先注册组件，然后return出去

data() {
   
    
    return {
   
      comName: "Left",
    };
  },
  components: {
   
    Left,
    Right,
  },

2.2.通过 is属性指定需要渲染哪个组件,is 属性被定义<component :is=""></component>中，component 标签是vue 内置的，作用:组件的占位符。is属性的值，表示要渲染的组件的名字，is属性的值，应该是组件在components节点下的注册名称

 <component :is="comName"></component>

2.3.我们通过点击按钮动态切换comName的组件名称，实现了组件的来回切换

<button @click="comName = 'Left'">展示Left<