如何实现组件切换vue 提供了component，来展现对应的组件。 component是一个占位符。v-bind:is

vue 提供了component，来展现对应的组件。 component是一个占位符。v-bind:is属性，可以来指定组件的名称。

<a a href="" @click.prevent= "comName='login'">登录 a链接阻止默认行为。组件的名称是字符串。

vue目前提供了几个标签。：component，template，transition，transitionGroup。

1、v-text --> innerText 普通文本 2、v-html --> innerHtml 会作为html显示出来 3、v-model --> 双向数据绑定 4、v-if --> 流程控制与它相似的是的 v-show v-show不会重新渲染dom 在页面隐藏元素 5、v-for --> 循环 1.v-if切换： v-if的方式来切换视图:创建和销毁(导致组件的状态不能留存) 2.v-show切换：显示和隐藏,没有办法操作Dom结构(会保存组件的状态) 3.动态组件切换：可以操作DOM, 并且可以留存下数据; 切换时触发的生命周期：激活activated 冻结 deactivated 这两个方法; 用keep-alive可保存组件的状态

二、使用component标签实现组件切换
Vue提供了component标签来展示对应组件。
使用v-bind绑定它的is属性，用来指定要展示的组件名称

       <a href="#" @click.prevent="comName = 'login'">登录</a>
        <a href="#" @click.prevent="comName = 'register'">注册</a>
        <a href="#" @click.prevent="comName = 'out'">退出</a>
        <!-- 
            Vue 提供的 component 来展示对应名称的组件
            component 是一个占位符
            :is 属性指定 组件名称
        -->
        <component :is="comName"></component>