能帮我在基于vue的框架上用html编一个登录注册界面的代码吗
时间: 2023-03-30 10:04:36 浏览: 50
当然可以,以下是一个基于Vue的登录注册界面的代码示例:
<template>
<div>
<h2>登录</h2>
<form>
<div>
<label for="username">用户名:</label>
<input type="text" id="username" v-model="username">
</div>
<div>
<label for="password">密码:</label>
<input type="password" id="password" v-model="password">
</div>
<button type="submit" @click.prevent="login">登录</button>
</form>
<h2>注册</h2>
<form>
<div>
<label for="newUsername">用户名:</label>
<input type="text" id="newUsername" v-model="newUsername">
</div>
<div>
<label for="newPassword">密码:</label>
<input type="password" id="newPassword" v-model="newPassword">
</div>
<div>
<label for="confirmPassword">确认密码:</label>
<input type="password" id="confirmPassword" v-model="confirmPassword">
</div>
<button type="submit" @click.prevent="register">注册</button>
</form>
</div>
</template>
<script>
export default {
data() {
return {
username: '',
password: '',
newUsername: '',
newPassword: '',
confirmPassword: ''
}
},
methods: {
login() {
// 处理登录逻辑
},
register() {
// 处理注册逻辑
}
}
}
</script>