开始前，请先完成用户登录鉴权，详见
【微信小程序-原生开发】实用教程11 - 用户登录鉴权（含云函数的创建、删除、使用，通过云函数获取用户的openid）_朝阳39的博客-CSDN博客
https://blog.csdn.net/weixin_41192489/article/details/129314349
创建注册页
pages\register\index.wxml
<view class="box"> <form wx:if="{{type == '注册'}}" bindsubmit="saveInfo"> <input maxlength="10" name='nickname' type="nickname" placeholder="请输入昵称" /> <radio-group class="radioBox" name='gender'> <radio color='#027CBE' checked value='1'>男</radio> <radio color='pink' value='2'>女</radio> </radio-group> <input maxlength="20" name='identification' placeholder="请输入微信号/可添加微信的手机号" /> <button form-type="submit">注册</button> </form> <view wx:if="{{type == '已注册'}}" class="resultBox"> <t-result wx:if="{{userInfo.accountStatus === '被拒绝'}}" theme="error" title="您的申请未通过" description="可微信咨询 sunshinehu39" /> <t-result wx:else theme="success" title="注册信息已提交" description="请耐心等待审核结果" /> </view> </view>
- input 标签的 type 为 nickname 时，用户点击该输入框，会出现用户微信昵称的快捷输入，方便用户快速输入微信的昵称（用户也可输入其他昵称）
pages\register\index.wxss
.box { padding: 40rpx; } .radioBox { padding-bottom: 30rpx; display: flex; justify-content: space-around; } .resultBox { margin-top: 200rpx; }
pages\register\index.json
{ "usingComponents": { "t-result": "tdesign-miniprogram/result/result", "t-input": "tdesign-miniprogram/input/input", "t-button": "tdesign-miniprogram/button/button", "t-link": "tdesign-miniprogram/link/link" } }
pages\register\index.js
Page({ data: { userInfo: {}, type: '' }, onLoad(options) { this.setData({ type: options.type }) if (this.data.type == "已注册") { this.setData({ userInfo: wx.getStorageSync('userInfo') }) } }, saveInfo: function (e) { let nickname = e.detail.value.nickname let gender = e.detail.value.gender let identification = e.detail.value.identification if (!nickname) { info('昵称不能为空') return } if (!identification) { info('微信号/手机号不能为空') return } wx.cloud.database().collection('user').add({ data: { nickname: nickname, //昵称 gender: gender, //性别 identification: identification, //身份验证 createTime: new Date(), //创建时间 avatarUrl: '', //头像 accountStatus: '待审核', //审核状态 mark: '' //备注 } }).then(res => { wx.showToast({ icon: 'success', title: '注册成功', }) this.setData({ type: '已注册' }) }) } })
