大众点评
思路:从微信开发者文档中找到框架里面的页面配置,配置顶里面有navigationStyle导航栏样式设置,设置为custom就可以自定义设置样式了,接着可以设置自己想要的样式,但是呢,我发现自己设置的样式切换时无法与右上角胶囊按钮对齐,通过查询,从界面 /菜单 /wx.getMenuButtonBoundingClientRect找到了胶囊的布局位置信息,这样我们可以拿取到位置详情,赋值给我们设置的样式上,就可以实现了 关键代码:
设置自定义导航栏样式 "navigationStyle": "custom" 拿取到胶囊值:let obj = wx.getMenuButtonBoundingClientRect() this.setData({ pointobj: obj })
贝贝加油站
思路: 1.第一步通过wx.getUserProfile获取用户的是否同意获取信息权限,来获取用户的信息,然后回显在页面上, 2.关于二维码则是需要通过点击事件调用api的wx.scanCode事件,来获取用户的相机权限,可以通过onlyFromCamera来约束用户是否只能从相机扫码,不允许从相册选择图片 3.先在app.json配置getLocation,然后通过wx.getLocation授权获取用户地址,来获取经纬度,调用接口,从而调用接口,显示用户附近的加油站
// 获取用户信息 getUserProfile(e) { wx.getUserProfile({ desc: '用于完善会员资料', success: (res) => { console.log(res); this.setData({ userInfo: res.userInfo, hasUserInfo: true }) } })
// 调用用户扫码功能 setScanCode(e) { wx.scanCode({ success(res) { console.log(res) } }) },
json配置项:"permission": { "scope.userLocation": { "desc": "获取您的位置推荐最近加油站" }, "requiredPrivateInfos": [ "getLocation" ] },
获取位置代码: let _this = this wx.getLocation({ desc: '获取用户位置', success(res) { res.latitude, res.longitude wx.request({ url: 'http://129.211.169.131:6368/getShellList', data: { point: res.latitude + ',' + res.longitude }, success: (res) => { _this.setData({ list: res.data.list }) }, }) }, })