学长认证模块产品官方原型图讲解：功能不复杂，但细节很多

大家好，我是你们的大拿老师！

本期讲解的是学长学姐认证模块官方原型图的内容。

简单的认证流程为：

认证中——审核中——审核失败——重新认证

核心重点：认证信息和渠道。功能并不复杂，但是细节很多。

1.学校选择

无论是UI、前端还是开发，注意学校不是输入性，而是选择性。点击触发省和学校两级的联动，先选省，然后再选学校。

关于样式，前端和UI需要注意，前端用的是vue加vant的样式框架，vant里面已经有了二级和三级的联动，包括下面的时间选择，那么UI同学一定要注意，去搜索vant的样式，不要自己过度发挥UI的一些常用的、默认的组件，但可以改字体大小和颜色。

在开发阶段，自己模拟一些数据，不要等着产品部门提供数据，等到后面真正数据出来再补入。

2.输入专业信息

输入专业信息限制在15个字以内，前端和数据库后端都要作出限制。

3.在校时间

点击底部弹出时间选择，采用年月的格式，注意：只到月份。要求在校开始时间必须小于当前时间。

4.导师信息

注意这个地方选填，开发的时候注意它是可以不填的。

5.研究方向

选填，也是让用户来选，不管前端还是JAVA，一定要做好准确的校验。

6.认证方式

设计的时候是一个tab，任选一种认证方式，只要有一种验证完成就算验证成功，不支持第二种验证。

第一种认证：学校邮箱，必须以教育邮箱结尾，前端需要校验邮箱格式。如果后面想继续的优化，可以把所有的院校的邮箱做对应。
注意点：邮箱的交互。
两套方式，一套是发一个认证链接，发到邮箱里面，点进链接然后再跳转。
另外一种的话是通过类似于手机验证码的模式来校验。验证码：四位。产品要求：就是一天最多发送十次，倒计时的时候不能再点，验证码有效期为五分钟。

第二种认证：校园卡/学生证。我们需要的信息是学校专业和姓名，其他相关信息可以上传。这个逻辑比较难做，首先，UI要实现上传样式的一个控件，控件逻辑是前端用vant组件里面的文件上传。

7.提交认证

前端同学要去考虑接口是怎么实现的。

欢迎关注我们的WX公众号“拿OFFER”获取更多校招信息和硬核干货。