步骤一
完成页面排版
以及配制好接口数据
我的思路是
在一个文件夹里创建三个js文件
分别是env.js(环境配置)
module.exports={
//开发环境
dev:{
baseUrl:""
},
//生产环境
prod:{
baseUrl:'https://api.it120.cc'
},
//测试环境
test:{
baseUrl:''
}
}
request.js(ajax封装)
// 引入环境
const { baseUrl } = require('./env.js').prod
// 专属域名
const Url = 'wdw'
module.exports ={
request:function(url,method="get",data={},isSubDomain = true){
let fullUrl = `${baseUrl}/${isSubDomain ? Url : ''}/${url}`;
return new Promise((resolve,reject) =>{
wx.request({
url: fullUrl,
//请求方式
method,
//参数
data,
// 请求头
header:{
'Content-type':'application/x-www-form-urlencoded'
},
success(res){
// console.log("接口数据",res)
//下面判断有时有这个&& res.data.code === 0
if(res.statusCode === 200 ){
// console.log(1)
resolve(res.data)
}
else{
// console.log(2)
reject('接口有问题')
}
},
fail(error){
// console.log(3)
reject('数据接口有问题')
}
})
})
}
}
api.js(项目中各种业务接口的封装)
// 引入请求函数
const { request } = require('./request.js')
//项目中用到的各种业务接口的封装
module.exports={
//用户注册
getwxre:(data)=>{
return request('user/wxapp/register/complex','POST',data,true)
},
//用户登录
login_wx: (code) => {
return request('user/wxapp/login','POST', {
code,
type: 2
} ,true)
},
}
步骤二
在wxml文件的标签添加事件
使用
bindgetuserinfo=“自定义事件”
在js文件的生命周期里
调用自定义事件
自定义事件(e){
可以使用e获取用户信息
将接口需要的数据声明到变量
触发接口封装的注册事件(并将数据传入)
}
在接口封装的注册事件里调用登录事件
把获取到的用户数据保存到本地 使用时获取
以上为个人练习时的思路 仅供参考