小程序的登录注册

步骤一

完成页面排版
以及配制好接口数据
我的思路是
在一个文件夹里创建三个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获取用户信息
将接口需要的数据声明到变量
触发接口封装的注册事件(并将数据传入)
}
在接口封装的注册事件里调用登录事件
把获取到的用户数据保存到本地 使用时获取

以上为个人练习时的思路 仅供参考

你可能感兴趣的:(小程序的登录注册)