提交 153278ff 编写于 作者: 芊里

添加注册页面

上级 dc95d40c
......@@ -192,6 +192,15 @@
}
}
,{
"path" : "uni_modules/uni-login-page/pages/register/register",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
],
"globalStyle": {
"navigationBarTextStyle": "black",
......
// 表单校验规则由 schema2code 生成,不建议直接修改校验规则,而建议通过 schema2code 生成, 详情: https://uniapp.dcloud.net.cn/uniCloud/schema
const validator = {
"gender": {
"rules": [{
"format": "int"
},
{
"range": [{
"text": "未知",
"value": 0
},
{
"text": "",
"value": 1
},
{
"text": "",
"value": 2
}
]
}
],
"defaultValue": 0,
"label": "性别"
},
"username": {
"rules": [{
required: true,
errorMessage: '请输入用户名',
},
{
minLength: 3,
maxLength: 10,
errorMessage: '用户名长度在 {minLength} 到 {maxLength} 个字符',
}
],
"label": "用户名"
},
"nickname": {
"rules": [{
required: true,
errorMessage: '请输入昵称',
},
{
minLength: 3,
maxLength: 10,
errorMessage: '昵称长度在 {minLength} 到 {maxLength} 个字符',
}
],
"label": "昵称"
}
}
const enumConverter = {
"gender_valuetotext": {
"0": "未知",
"1": "",
"2": ""
}
}
export {
validator,
enumConverter
}
<template>
<view class="uni-container">
<uni-forms ref="form" :value="formData" :rules="rules" validate-trigger="submit" err-show-type="toast">
<uni-forms-item name="username" label="用户名" required>
<uni-easyinput placeholder="请输入用户名" v-model="formData.username" trim="both" />
</uni-forms-item>
<uni-forms-item name="gender" label="性别" required>
<uni-data-checkbox v-model="formData.gender" :localdata="formOptions.gender_localdata" />
</uni-forms-item>
<uni-forms-item name="nickname" label="昵称" required>
<uni-easyinput placeholder="请输入用户昵称" v-model="formData.nickname" trim="both" />
</uni-forms-item>
<view class="uni-button-group">
<button type="primary" class="uni-button" @click="submit">注册</button>
</view>
</uni-forms>
</view>
</template>
<script>
import {
validator
} from '../../js_sdk/validator/uni-id-users.js';
const db = uniCloud.database();
const dbCollectionName = 'uni-id-users';
function getValidator(fields) {
let reuslt = {}
for (let key in validator) {
if (fields.indexOf(key) > -1) {
reuslt[key] = validator[key]
}
}
return reuslt
}
export default {
data() {
return {
formData: {
"username": "",
"gender": 0,
"nickname": ""
},
formOptions: {
"gender_localdata": [{
"text": "未知",
"value": 0
}, {
"text": "",
"value": 1
},
{
"text": "",
"value": 2
}
]
},
rules: {
...getValidator(["username", "gender", "nickname"])
}
}
},
onReady() {
this.$refs.form.setRules(this.rules)
},
methods: {
/**
* 触发表单提交
*/
submit() {
uni.showLoading({
mask: true
})
this.$refs.form.submit().then((res) => {
console.log(res);
this.submitForm(res)
}).catch((errors) => {
console.log(errors);
})
.finally(() => {
uni.hideLoading()
})
},
submitForm(value) {
}
}
}
</script>
<style>
.uni-container {
padding: 15px;
}
.uni-input-border,
.uni-textarea-border {
width: 100%;
font-size: 14px;
color: #666;
border: 1px #e5e5e5 solid;
border-radius: 5px;
box-sizing: border-box;
}
.uni-input-border {
padding: 0 10px;
height: 35px;
}
.uni-textarea-border {
padding: 10px;
height: 80px;
}
.uni-button-group {
margin-top: 50px;
display: flex;
justify-content: center;
align-items: center;
}
.uni-button {
width: 184px;
padding: 12px 20px;
font-size: 14px;
border-radius: 4px;
line-height: 1;
margin: 0;
}
.avatar-box {
width: 700rpx;
height: 200rpx;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
justify-content: center;
align-items: center;
}
.avatar-img {
width: 150rpx;
height: 150rpx;
border-radius: 75rpx;
border: #F8F8F8 solid 3px;
}
</style>
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册