微信小程序官方文档

https://mp.weixin.qq.com/debug/wxadoc/dev/api/location.html

JS代码

//index.js
//获取应用实例
var app = getApp()
Page({
data: {
motto: '示例小程序-获取当前地理位、速度',
userInfo: {},
hasLocation:false,
location:{}
},
//事件处理函数
bindViewTap: function() {
wx.navigateTo({
url: '../logs/logs'
})
},
onLoad: function () {
console.log('onLoad')
var that = this
//调用应用实例的方法获取全局数据
app.getUserInfo(function(userInfo){
//更新数据
that.setData({
userInfo:userInfo
})
}),
wx.getLocation( {
success: function( res ) {
console.log( res )
that.setData( {
hasLocation: true,
location: {
longitude: res.longitude,
latitude: res.latitude
}
})
}
})
}
})

index.wxml

<!--index.wxml-->
<view class="container">
<view bindtap="bindViewTap" class="userinfo">
<image class="userinfo-avatar" src="{{userInfo.avatarUrl}}" background-size="cover"></image>
<text class="userinfo-nickname">{{userInfo.nickName}}</text>
</view>
<view class="usermotto">
<!-- <text class="user-motto">{{motto}}\n</text>-->
<text>经度:{{location.longitude}}\n</text>
<text>纬度:{{location.latitude}}</text>
</view>
</view>

运行效果

微信小程序实例-获取当前的地理位置、速度的更多相关文章

  1. 【微信小程序】获取用户地理位置权限,二次请求授权,逆解析获取地址

    摘要:微信小程序内获取用户地理位置信息授权,被拒绝后二次获取,获取权限后逆解析得到用户所在省市区等.. 场景:商城类小程序,在首页时需展示附近门店,即用户刚进入小程序时就需要获取到用户位置信息 ste ...

  2. 微信小程序实例源码大全

    微信小程序实例源码大全下载 微信小应用示例代码(phodal/weapp-quick)源码链接:https://github.com/phodal/weapp-quick 微信小应用地图定位demo( ...

  3. 微信小程序实例源码大全下载

     小程序QQ交流群:131894955  小程序开发直播腾讯课堂:  https://edu.csdn.net/course/detail/6743 微信小程序实例源码大全下载 微信小应用示例代码(p ...

  4. 微信小程序如何获取openid

    微信小程序如何获取openid wx.login({ success: res => { // 发送 res.code 到后台换取 openId, sessionKey, unionId // ...

  5. 微信小程序验证码获取倒计时

    wxml <button disabled='{{disabled}}' bindtap="goGetCode">{{code}}</button> js ...

  6. 微信小程序后台获取用户的opeid

    1.微信小程序后台获取登录用户的openid,首先微信小程序将code传给后台服务器 wx.login({ success: function (res) { var code = res.code ...

  7. 微信小程序,获取二维码

    微信小程序,获取二维码 找到一篇很实用的博客,他已经写得很详细了,自己也懒得写,亲测有效 参考网址

  8. nodejs+koa+uniapp实现微信小程序登陆获取用户手机号及openId

    nodejs+koa+uniapp实现微信小程序登陆获取用户手机号及openId 前言: 我准备用nodejs+koa+uniapp实现一款餐饮点单小程序,以及nodejs+koa+vue实现后端管理 ...

  9. uniapp的微信小程序,获取授权,获取中文街道地理位置

    w问题描述:在微信小程序模拟器上运行获取坐标时 获取不到信息,原因是 没有调起默认地理位置: 解决办法:或者在manifest.json的源码视图中配置:配置appid和地理位置 默认弹起获取地理位置 ...

随机推荐

  1. Hadoop MapReduce编程创建maven项目时所用到的pom依赖

    <dependency> <groupId>junit</groupId> <artifactId>junit</artifactId> & ...

  2. iOS AFNetWorking 下载pdf文档

    + (void)downLoadPdf:(NSString *)url pdf_id:(NSString *)pdf_id block:(APIFilePath)pdfFilePath {    NS ...

  3. [Leetcode][JAVA] Populating Next Right Pointers in Each Node II

    Follow up for problem "Populating Next Right Pointers in Each Node". What if the given tre ...

  4. 六款值得推荐的android(安卓)开源框架简介

    1.volley 项目地址 https://github.com/smanikandan14/Volley-demo (1)  JSON,图像等的异步下载: (2)  网络请求的排序(scheduli ...

  5. [2013 Final] Colors

    Description Ziyao has a big drawing board with N * M squares. At the beginning, all the squares on t ...

  6. 用c#开发微信 (7) 微渠道 - 推广渠道管理系统 2 业务逻辑实现

    我们可以使用微信的“生成带参数二维码接口”和 “用户管理接口”,来实现生成能标识不同推广渠道的二维码,记录分配给不同推广渠道二维码被扫描的信息.这样就可以统计和分析不同推广渠道的推广效果. 上次介绍了 ...

  7. Html5文件

    HTML5 file api 读取文件MD5码 http://www.zhuwenlong.com/blog/52d6769f93dcae3050000003

  8. Xperf Analysis Basics(转)

      FQ不易,转载 http://randomascii.wordpress.com/2011/08/23/xperf-analysis-basics/ I started writing a des ...

  9. [stm32] Systick

    (一) 背景介绍在传统的嵌入式系统软件按中通常实现 Delay(N) 函数的方法为:for(i=0;i<=x;i++); x--:            对应于N毫秒的循环值对于STM32系列微 ...

  10. Atitit WebDriver技术规范原理与概念

    Atitit WebDriver技术规范原理与概念 1. Book haosyo ma1 2. WebDriver是W3C的一个标准,由Selenium主持.1 3. WebDriver如何工作 (z ...