VUE切换登录模式
简陋的切换登录 哈哈
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="app">
<template v-if="type=='email'">
<label for="email">邮箱</label>
<input type="text" id="email" name="email" placeholder="请输入邮箱">
</template>
<template v-else-if="type=='phone'">
<label for="phone">手机号</label>
<input type="text" id="phone" name="phone" placeholder="请输入手机号">
</template>
<button @click="changeType">切换登录模式</button>
</div>
<script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>
<script type="text/javascript">
var app=new Vue({
el:"#app",
data:{
type:"email"
},
methods:{
changeType:function(){
if(this.type=="email"){
this.type="phone"
}else{
this.type="email"
}
}
}
})
</script>
</body>
</html>
扫一扫
3737
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
