uniapp的登录注册用api实现

 一、什么是API

API（Application Programming Interface，应用程序接口），就是软件系统不同组成部分衔接的约定。其主要目的是让应用程序开发人员得以调用一组例程功能，而无须考虑其底层的源代码为何、或理解其内部工作机制的细节。API本身是抽象的，它仅定义了一个接口，而不涉及应用程序在实际实现过程中的具体操作。

二、登录注册页面展示

三、代码功能实现

 

当前页面内容涉及到uni-forms表单组件的使用， 通常用来做表单校验和提交。每一个 uni-forms-item 是它的一个表单域组件，用来承载表单具体内容，uni-forms-item 中可以嵌套 uni-easyinput、uni-data-checkbox 和 uni-app 内置的表单组件。

四、校验规则

校验规则接受一个 Object 类型的值，通过传入不同的规则来表示每个表单域的值该如何校验

对象的 key 表示当前表单域的字段名，value 为具体的校验规则。

 

在使用uni-forms表单时的注意事项：

uni-forms表单校验的使用：

1.uni-forms 需要通过 rules 属性传入约定的校验规则

2.uni-forms需要绑定model属性，值为表单的key\value组成的对象。

3.uni-forms-item 需要设置 name属性为当前字段名，字段为String|Array类型。

4.只要使用的组件不管是内置组件还是三方组件，只需绑定v-model，无需其他操作，即可参与校验。

表单校验还可以直接通过 uniCloud web 控制台 快速根据 schema 自动生成表单维护界面，比如新建页面和编辑页面，自动处理校验规则。

 五、校验请求参数

六、发送登录的接口请求API

 uni.request(参数名)：用于发送网络请求。

 注意：method有效值必须大写，每个平台支持的method有效值不同。

 

七、数据缓存 

用 if 条件判断语句判断当前用户是否登录成功，如果登录成功则跳转到首页（pages/index/index);

 

 

 else :如果失败则返回登录失败信息

八、注册页面

 注册页面和登录页面差不多，只需要将登录页面的API改为注册页面的API就可以了。

小结：

 uni-app是一个使用vue.js开发所有前端应用的框架，如果之前没有代码基础，一开始只需要掌握 Vue.js 语法即可，其他相关的知识点我们可以边做项目边补充。

与我们学习一门新的编程语言的思路一样，如果想要快速上手的话，我们不需要在刚开始学习的时候，就要弄清楚开发所需要的全部语法、组件等。这样会耗费掉我们大量的时间，并且没有实例的支撑，学习起来会很抽象，导致后面很难坚持下去。

如果你有一些代码基础了，在我们刚开始学习 uni-app 时，建议先创建一个 uni-app 项目，先学习如何将项目运行起来，跟着课程一步步的填充代码，并看到实时展现出来的效果，这样会让我们学习和开发的过程更有趣更高效。