<div id="app">
<template v-if="loginType==='username'">
<label>Username</label>
<input placeholder="Enter your username">
</template>
<template v-else>
<label>Emial</label>
<input placeholder="Enter your email address" name="" value="">
</template>
<button v-on:click="toggle()">变化</button>
</div>
<script src="js/vue.js" charset="utf-8"></script>
<script type="text/javascript">
var app = new Vue({
el:'#app',
data:{
loginType:'username'
},
methods:{
toggle:function(){
return this.loginType = this.loginType==='username'?'email':'username'
}
}
})
</script>
<template v-if="loginType==='username'">
<label>Username</label>
<input placeholder="Enter your username">
</template>
<template v-else>
<label>Emial</label>
<input placeholder="Enter your email address" name="" value="">
</template>
<button v-on:click="toggle()">变化</button>
</div>
<script src="js/vue.js" charset="utf-8"></script>
<script type="text/javascript">
var app = new Vue({
el:'#app',
data:{
loginType:'username'
},
methods:{
toggle:function(){
return this.loginType = this.loginType==='username'?'email':'username'
}
}
})
</script>