基于elmentUI 生成一个登陆界面
时间: 2023-07-16 14:16:13 浏览: 55
好的,下面是基于 ElementUI 生成的一个简单的登录界面代码示例:
```html
<template>
<el-form ref="loginForm" :model="loginForm" label-width="80px">
<el-form-item label="用户名" prop="username">
<el-input v-model="loginForm.username"></el-input>
</el-form-item>
<el-form-item label="密码" prop="password">
<el-input type="password" v-model="loginForm.password"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm">登录</el-button>
</el-form-item>
</el-form>
</template>
<script>
export default {
data() {
return {
loginForm: {
username: '',
password: ''
}
}
},
methods: {
submitForm() {
this.$refs.loginForm.validate(valid => {
if (valid) {
// TODO: 登录验证逻辑
}
})
}
}
}
</script>
```
需要注意的是,此代码依赖 ElementUI 组件库和 Vue.js,需要在项目中先引入相应的依赖。