组件切换-使用v-if和v-else结合flag进行切换
一、v-if和v-else组件切换
实现不同组件的切换，在Vue里怎么实现两个组件的切换，新建一个html。
1.首先要有两个组件
<script>
vue.component(‘login’,{
template:’<h3>登录组件</h3>’
})
vue.component(‘register’,{
template:’<h3>注册组件</h3>’
})
2.实现点击链接，让这两个组件实现切换
例：
<div id=”app”>
<a href=”” >登录</a>
<a href=”” >注册</a>
3.把这两个组件往页面上引用一下，再右键浏览
<login v-if=”flag”></login>
<register v-else=”flag”></register>
</div>
4.两个都显示出来了，默认只展示登录不展示注册
var vm = new vue({
el:’#app’,
data:{
flag:true
},
methods:{}
})
5. 如果flag为true只展示login不展示register
<login v-if=＂flag＂></login>
<register v-else=＂flag＂></register>
6. 注册组件和登录组件展示与否是由flag来实现，点击登录和注册时修改flag的值
7. 在a标签里添加点击事件
<a href=”” @click.prevent=”flag=ture”>登录</a>
<a href=”” @click.prevent=”flag=false”>注册</a>
