微信小程序如何获取地址


Posted in Javascript onDecember 24, 2019

本文实例为大家分享了微信小程序获取地址的具体代码,供大家参考,具体内容如下

微信小程序如何获取地址

wxml

<map id="map" longitude="{{data.longitude}}" latitude="{{data.latitude}}" scale="14" markers="{{markers}}" polyline="{{polyline}}" show-location style="width: 100%; height: 500px;"></map>
<text>
 {{data.longitude}}
 {{data.latitude}}
 {{address}}
</text>
<!-- longitude 中心经度 -->
<!-- latitude 中心纬度 -->
<!-- scale 缩放级别,取值范围为3-20 -->
<!-- markers 标记点 -->

js

var QQMapWX = require('../js/qqmap-wx-jssdk.js');
var qqmapsdk;
Page({
 data:{
  data:"",
  str:"",
  address:""
 },
 onLoad: function () {
  let _this = this;
  // 实例化API核心类
  qqmapsdk = new QQMapWX({
   key: 'key'
  });
  // Promise 获取地址
  let gets = new Promise((resolve, reject) => {
   wx.getLocation({
    type: 'wgs84',
    success:resolve
   })
  }).then(function(res){
   console.log(res)
   _this.setData({
    data:res
   })
  })

  // 正常方式获取地址
  wx.getLocation({
   type: 'wgs84',
   success:function(res){
    _this.setData({
     str: _this.res
    })
    console.log(res)
    var demo = new QQMapWX({
     key: 'key'
    });
    // 解析地址
    demo.reverseGeocoder({//地址解析
     location: {
      latitude: res.latitude,
      longitude: res.longitude
     },
     success: function (res) {//转为具体地址
      console.log(res);
      //获得地址
      _this.setData({
       address: res.result.address
      })
     },
     fail: function (res) {
      console.log(res);
     }
    });
   }
  })
 },

为大家推荐现在关注度比较高的微信小程序教程一篇:《微信小程序开发教程》小编为大家精心整理的,希望喜欢。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 语言的递归编程
May 18 Javascript
jQuery队列控制方法详解queue()/dequeue()/clearQueue()
Dec 02 Javascript
对之前写的jquery分页做下升级
Jun 19 Javascript
JavaScript定义变量和变量优先级问题探讨
Oct 11 Javascript
js使用split函数按照多个字符对字符串进行分割的方法
Mar 20 Javascript
jQuery实现向下滑出的平滑下拉菜单效果
Aug 21 Javascript
输入框点击时边框变色效果的实现方法
Dec 26 Javascript
Angular Renderer (渲染器)的具体使用
May 03 Javascript
VUE+Element UI实现简单的表格行内编辑效果的示例的代码
Oct 31 Javascript
node.js实现带进度条的多文件上传
Mar 27 Javascript
关于vue路由缓存清除在main.js中的设置
Nov 06 Javascript
vue+swiper实现左右滑动的测试题功能
Oct 30 Javascript
浅析vue-router中params和query的区别
Dec 24 #Javascript
JavaScript实现英语单词题库
Dec 24 #Javascript
iSlider手机端图片滑动切换插件使用详解
Dec 24 #Javascript
微信小程序自定义模态弹窗组件详解
Dec 24 #Javascript
js实现鼠标点击页面弹出自定义文字效果
Dec 24 #Javascript
javascript实现鼠标点击生成文字特效
Dec 24 #Javascript
Javascript实现鼠标点击冒泡特效
Dec 24 #Javascript
You might like
typecho插件编写教程(五):核心代码
2015/05/28 PHP
PHP的serialize序列化数据以及JSON格式化数据分析
2015/10/10 PHP
php处理复杂xml数据示例
2016/07/11 PHP
iis6手工创建网站后无法运行php脚本的解决方法
2017/06/08 PHP
Javascript 设计模式(二) 闭包
2010/05/26 Javascript
ajax 同步请求和异步请求的差异分析
2011/07/04 Javascript
js里怎么取select标签里的值并修改
2012/12/10 Javascript
关于IE中getElementsByClassName不能用的问题解决方法
2013/08/26 Javascript
jquery显示隐藏input对象
2014/07/21 Javascript
jQuery中empty()方法用法实例
2015/01/16 Javascript
JQuery给网页更换皮肤的方法
2015/05/30 Javascript
JQuery标签页效果的两个实例讲解(4)
2015/09/17 Javascript
跟我学习javascript的函数和函数表达式
2015/11/16 Javascript
深入分析javascript中console命令
2016/08/14 Javascript
JavaScript 网页中实现一个计算当年还剩多少时间的倒数计时程序
2017/01/25 Javascript
如何解决vue与传统jquery插件冲突
2017/03/20 Javascript
JS实现的Unicode编码转换操作示例
2017/04/28 Javascript
Bootstrap模态框插入视频的实现代码
2017/06/25 Javascript
基于js中style.width与offsetWidth的区别(详解)
2017/11/12 Javascript
使用express+multer实现node中的图片上传功能
2018/02/02 Javascript
javascript闭包的使用之按钮切换功能
2018/08/30 Javascript
VUE 解决mode为history页面为空白的问题
2019/11/01 Javascript
js实现可爱的气泡特效
2020/09/05 Javascript
基于Django用户认证系统详解
2018/02/21 Python
python实现超市扫码仪计费
2018/05/30 Python
Python提取支付宝和微信支付二维码的示例代码
2019/02/15 Python
python IDLE 背景以及字体大小的修改方法
2019/07/12 Python
Python 基于wxpy库实现微信添加好友功能(简洁)
2019/11/29 Python
结合CSS3的新特性来总结垂直居中的实现方法
2016/05/30 HTML / CSS
解释一下Windows的消息机制
2014/01/30 面试题
网络技术专业求职信
2014/07/13 职场文书
升国旗演讲稿
2014/09/05 职场文书
2014年评职称工作总结
2014/11/20 职场文书
幼儿教师辞职信
2015/02/27 职场文书
应届生个人的求职(自荐信范文2篇)
2019/08/23 职场文书
MyBatis XPathParser解析器使用范例详解
2022/07/15 Java/Android