软工-部分
所有代码会在最后一起展示。
先在page的data里面加入下列变量(用来映射到wxml进行显示的,不加运行时会报错)
代码如下
data: {
motto: 'hello world',
flag:'',//用来判断是否到场,这三行如果显示到wxml的话是必须添加的
latitude:0,//纬度
longitude:0,//经度
userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse('button.open-type.getUserInfo'),
canIUseGetUserProfile: false,
canIUseOpenData: wx.canIUse('open-data.type.userAvatarUrl') && wx.canIUse('open-data.type.userNickName') // 如需尝试获取用户信息可改为false
},
要实现定位功能,必须先写一个用来获取设备权限的函数getlocation这个是用来调取微信自带的api来进行申请的
在onload里面写上即可。
//这个函数是用来获取定位权限的,但是每次编译只会在第一次显示,获取过的不会继续弹窗,如果想看效果的话请先清缓存
wx.getSetting({
success: (res) => {
console.log(JSON.stringify(res))
// res.authSetting['scope.userLocation'] == undefined 表示 初始化进入该页面
// res.authSetting['scope.userLocation'] == false 表示 非初始化进入该页面,且未授权
// res.authSetting['scope.userLocation'] == true 表示 地理位置授权
if (res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true) {
wx.showModal({
title: '请求授权当前位置',
content: '需要获取您的地理位置,请确认授权',
success: function (res) {
if (res.cancel) {
wx.showToast({
title: '拒绝授权',
icon: 'none',
duration: 1000
})
} else if (res.confirm) {
wx.openSetting({
success: function (dataAu) {
if (dataAu.authSetting["scope.userLocation"] == true) {
wx.showToast({
title: '授权成功',
icon: 'success',
duration: 1000
})
//再次授权,调用wx.getLocation的API
} else {
wx.showToast({
title: '授权失败',
icon: 'none',
duration: 1000
})
}
}
})
}
}
})
} else if (res.authSetting['scope.userLocation'] == undefined) {
//调用wx.getLocation的API
}
else {
//调用wx.getLocation的API
}
}
})
如果成功了控制台结果的输出会有显示。
接下来获得设备信息后从中直接抽取经纬度即可。对抽取的经纬度信息作比较
还有就是对js不太熟,往data里面存数据只会调用that.setDate方法,看起来比较乱
//用于获取用户的经纬度信息
var that = this
//获取当前的地理位置、速度
wx.getLocation({
type: 'wgs84', // 默认为 wgs84 返回 gps 坐标,gcj02 返回可用于 wx.openLocation 的坐标
success: function (res) {
//赋值经纬度
that.setData({
latitude: res.latitude,
longitude: res.longitude,
})
if( 30.4589407< res.latitude&& res.latitude< 30.459363
&& 114.6129708< res.longitude&& res.longitude< 114.621189){
that.setData({
flag:"是"
})
}else{
that.setData({
flag:"否"
})
}
}
}
)
Index.wxml部分
加入下面的三行即可
<view class="container">
<view>纬度:{{latitude}}view>
<view>经度:{{longitude}}view>
<view>是否在教室:{{flag}}view>
<view class="userinfo">
app.jason部分
需要额外添加一个许可也是用来获取权限的
"permission": {
"scope.userLocation": {
"desc": "你的位置信息将用于小程序位置接口的效果展示"
}
}
注意!要加到jason的{}里面!
所有代码
index.js
// index.js
// 获取应用实例
const app = getApp()
?
?
?
Page({
data: {
motto: 'hello world',
flag:'',
latitude:0,
longitude:0,
userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse('button.open-type.getUserInfo'),
canIUseGetUserProfile: false,
canIUseOpenData: wx.canIUse('open-data.type.userAvatarUrl') && wx.canIUse('open-data.type.userNickName') // 如需尝试获取用户信息可改为false
},
// 事件处理函数
bindViewTap() {
wx.navigateTo({
url: '../logs/logs'
})
},
onLoad() {
if (wx.getUserProfile) {
this.setData({
canIUseGetUserProfile: true
})
}
},
getUserProfile(e) {
// 推荐使用wx.getUserProfile获取用户信息,开发者每次通过该接口获取用户个人信息均需用户确认,开发者妥善保管用户快速填写的头像昵称,避免重复弹窗
wx.getUserProfile({
desc: '展示用户信息', // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写
success: (res) => {
console.log(res)
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
})
},
getUserInfo(e) {
// 不推荐使用getUserInfo获取用户信息,预计自2021年4月13日起,getUserInfo将不再弹出弹窗,并直接返回匿名的用户个人信息
console.log(e)
this.setData({
userInfo: e.detail.userInfo,
hasUserInfo: true
})
},
?
onLoad: function (options) {
//这个函数是用来获取定位权限的,但是每次编译只会在第一次显示,获取过的不会继续弹窗,如果想看效果的话请先清缓存
wx.getSetting({
success: (res) => {
console.log(JSON.stringify(res))
// res.authSetting['scope.userLocation'] == undefined 表示 初始化进入该页面
// res.authSetting['scope.userLocation'] == false 表示 非初始化进入该页面,且未授权
// res.authSetting['scope.userLocation'] == true 表示 地理位置授权
if (res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true) {
wx.showModal({
title: '请求授权当前位置',
content: '需要获取您的地理位置,请确认授权',
success: function (res) {
if (res.cancel) {
wx.showToast({
title: '拒绝授权',
icon: 'none',
duration: 1000
})
} else if (res.confirm) {
wx.openSetting({
success: function (dataAu) {
if (dataAu.authSetting["scope.userLocation"] == true) {
wx.showToast({
title: '授权成功',
icon: 'success',
duration: 1000
})
//再次授权,调用wx.getLocation的API
} else {
wx.