小程序系列--Presenter简单使用小程序系列--Presenter简单使用

在wx小程序的开发过程中，大部分的逻辑代码都写在Page对象中（类似Activity）。如果逻辑很多的话，会导致Page.js越来越臃肿，影响代码的阅读与修改。所以，可以把Android中的MVP思想应用到Page中。

wx的Page本身用的是 VM 的思想，将数据与View绑定，通过setData() 将数据映射到UI。非常像 DataBinding,但比DataBinding简单很多且不是双向绑定。

可以新建文件夹presenter 将所有的 presenter JS文件放在这个目录下。

var url = require("../network/urlConfig.js").url; var httpUtils = require("../network/HttpUtils.js"); function loginRequest(data, resp) {httpUtils.request({ url: url.loginUrl, data: data, success: function (data) { httpUtils.saveHttpHeader(data.userId, data.token); if (resp) resp.success(data); } } ); }function login(resp) { //wx登陆 wx.login({ success: function (res) { if (res.code) { var code = res.code; //wx获取用户信息 wx.getUserInfo({ success: function (res) { var userInfo = res.userInfo var nickName = userInfo.nickName var avatarUrl = userInfo.avatarUrl var gender = userInfo.gender //性别 0：未知、1：男、2：女 var province = userInfo.province var city = userInfo.city var country = userInfo.country //注册/登陆逻辑 loginRequest( { //data 对象 code: code, nickName: nickName, avatar: avatarUrl, gender: gender, city: city, province: province }, { //response 对象 success: function (data) { if (resp) { resp.success(data); } } }); }, }) } } }) }//暴露方法 module.exports = { login }

在Page 中直接调用

var presenter = require("../../presenter/UserPresenter.js"); Page({ data: {},onLoad: function () { presenter.login({ success: data => { console.log(data); } }); }, })

详细代码参见源码
【小程序系列--Presenter简单使用】gitHub源码