一念执着。c的博客

今天记录下获取用户位置wx.getLocation，代码也比较简单，所以简单的记录下，先看下getLocation方法，首先接收一个callback，这个callback只是方便一下，当拿到经纬度后，只调用一个函数时才传，如果后面需要调用多个函数，那么就是通过我们return的Promise了下面说下Promise里面的逻辑，首先就是判断app.js中是否有这个经纬度，如果有的话，把这个经纬度包装下返回给callback或resolve，否则使用wx.getLocation获取，然后把经纬度存在全.

这里的分页呢就记录下，上拉加载的，小程序给我们提供了一个监听滚动到底部的周期函数onReachBottom，当页面超过整屏的高度后，滚动页面到底部就会触发这个事件，所以做上拉加载的时候，非常的方便，下面说下我们的封装逻辑先描述下可能需要的ui效果，第一种就是wx.showLoading，在接口调起前后使用wx.showLoading来显示正在加载到状态，这个在(小程序开发(3)-之wx.request封装)中有说到过，还有一种就是供自己自定义loading的ui了，会提供一个loading的字段做.

嘿，支付好像没什么好说的，记录下吧像下面的代码，params毫无疑问呢，就是需要传给接口的参数了，一般就是订单号和金额了，appId呢当然是放在config.js文件中，openId呢就是一开始的时候就获取的，通过wx.login拿到openId后，存储在本地，拿到接口返回的数据后，就是调用wx.requestPayment，发起支付，搞定了function enclosureJHpay(params) { var _this = this; let userInfo = wx.g

map用起来真的一言难尽呀，按照官方文档说是可以支持传入一个setting，来配置所以的属性的。。，但是我试了没效果，经纬度更新了，调试代码看到的wxml经纬度也变化了，但是map上的经纬度却没变化，后来就是按照普遍的写法做了，一个个属性配置，因为我们项目中用了很多map，所以定义了一个common的setting，保持所有的map都一致，如果需要特别配置，可以在导出setting的page上自定义修改对应属性// map setting的默认配置const common = { latitud

嗯嗯，这个其实没什么好说，但还是说说我们项目的做法，因为我们这里需要跳转的小程序挺多的，所以我们采用了在后台配置的，像图一一样，配置名称、appid、跳转的页面地址等wx.navigateToMiniProgram({ appId: item.appId, success(res) { // 打开成功 console.log(res);

#先说下获取手机号的步骤，首先要调用wx.login拿到code，把code发送到我们的服务器(开发者服务器)上，后台通过appid、appsecret(小程序后台那里生成的)、code向微信接口服务拿到session_key、openid等信息，到这里其实我们已经可以直接去获取手机号了，自定义登录态，如果项目需要可以做https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/login.html#获取手机号.

#如图一所示，我们在导航栏中加了个文案和搜索框第一步我们需要在app.json->window设置，还可配置更多的选项 ：{"navigationStyle": "custom","backgroundTextStyle": "light","navigationBarBackgroundColor": "#fff","navigationBarTitleText": "Weixin","navigationBarTextStyle": "black"}第二步获取导航和

小程序的组件和页面的代码结构是不一样的，不是像vue、react那些一样，页面是通过Page生成，组件是通过Component，下面介绍下常用到的#data很明显和页面上定义的data没有差别#properties接收的属性，类似于vue中的props#options配置项，像addGlobalClass就是允许添加全局样式，就是全局样式能否在组件中生效，multipleSlots是否使用插槽slot#ready组件初始化的方法#methods定义方法的地方.

#为了获取token，所以需要搞个模拟登陆，用一个特定的账号，对密码进行md5加密，也只是在app.js那里进行一次调用，这里主要是说一下globalData.checkLogin、checkLoginReadyCallback，这时this指向的是全局的app对象首先以首页为例，如果我们在首页调用接口的话，那肯定需要先拿到token先，再调用其他业务接口，所以我们先在首页调用await util.checkLogin()，代码如图三所示，如果globalData.checkLogin的值已经为t.

#主要的封装是wxRequest、wxRequestGet、wxRequestPost、wxRequestPromise、headers这几个函数，由于太过赘余不进行截图展示，可以看utils.js#wxRequest方法wxRequest其实跟原始的wx.request没有太大的不同，相当于一个中间键，可以更灵活的配置，可维护性更高，一致请求，首先来解析一些wxRequest，以下简介的说明下获取本地存储的token(ssoAuthToken)，如果token存在就设置header，直接.

#app.js小程序的入口文件，也可以说是一个全局的变量，因为我们经常会在一些页面里这样使用它const app = getApp();我们可以在这里做一些初始化的操作，每次启动小程序的时候，都会先执行一边这里，可以对一些常用的全局变量进行一个存放，赋值到app对象上，另外一些登录操作也可以在操作，获取系统的信息等在这里我们比较常用的是globalData，用来存放一些全局的数据或自定义的数据，更多具体的生命周期钩子函数可以看官方说明#app.wxss小程序的全局样式文件，一些自定.

#以下图片是小程序的目录结构，建议所有的目录都使用小写字母，不使用驼峰格式#组件components是自定义组件目录，对一些常用的组件的封装#配置文件config是配置文件，存有一些常用的字段和请求地址#第三方库libs是一些外部的库，一些没有通过npm安装的包，例如存放了腾讯地图webService的js文件#分包livepackage、package、pages、storepackage是分包和主包资源文件，因为小程序对每个包都有2M的限制，防止每个包过大，导

1.获取页面可视区的高度//getSystemInfoSync是获取系统的信息的wx.getSystemInfoSync().windowHeight;2.获取页面的dom元素，原生js在小程序中是无法获取到dom元素的，可以通过下面的方式获取//https://developers.weixin.qq.com/miniprogram/dev/api/SelectorQuery.exec...