flower-app/src/views/login.vue
2023-05-28 21:19:03 +08:00

53 lines
1.2 KiB
Vue

<template>
<div class="box">
<van-form @submit="onSubmit">
<van-cell-group inset>
<van-field
v-model="account.id"
name="id"
label="用户名"
placeholder="用户名"
:rules="[{ required: true, message: '请填写用户名' }]"
/>
<van-field
v-model="account.password"
type="password"
name="password"
label="密码"
placeholder="密码"
:rules="[{ required: true, message: '请填写密码' }]"
/>
</van-cell-group>
<div style="margin: 16px;">
<van-button round block type="primary" native-type="submit">
提交
</van-button>
</div>
</van-form>
</div>
</template>
<script setup lang="ts">
import { reactive} from 'vue';
import { UserType } from '../types/user';
import { userLogin } from '../api/user';
const account = reactive({
id: "blahblah",
password:"pwd123"
})
const onSubmit = (account:UserType) => {
console.log('submit', account);
userLogin(account).then(res => {
console.log("登陆成功",res);
})
};
</script>
<style lang="scss" scoped>
.box{
padding-top: 40px;
}
</style>