微信小程序可搜索的地址选择实现详解

这篇文章主要介绍了微信小程序 可搜索的地址选择实现详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

我们提供的服务有:网站设计、成都网站制作、微信公众号开发、网站优化、网站认证、渭源ssl等。为上千余家企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务,是有科学管理、有技术的渭源网站制作公司

最终实现效果:

微信小程序 可搜索的地址选择实现详解

效果实现步骤

新建index文件夹

index.wxml



 
  
 

index.js

// pages/index/index.js
Page({
 data: {
  address: ''
 },
 onChangeAddress() {
  var _page = this;
  wx.chooseLocation({
   success: (res) => {
    _page.setData({
     address: res.name
    });
   },
   fail: (err) => {
    console.log(err);
   }
  });
 }
})

新建map文件夹

map.wxml



 

map.js

// pages/map/map.js
Page({
 data: {
  latitude: 31.22786,
  longitude: 121.46658,
  markers: [{
   id: 1,
   latitude: 31.22786,
   longitude: 121.46658,
   name: '上海招商局广场'
  }]
 },
 onReady(e) {
  this.mapCtx = wx.createMapContext('myMap')
 }
})

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持创新互联。


当前名称:微信小程序可搜索的地址选择实现详解
分享地址:http://bzwzjz.com/article/gcghco.html

其他资讯

Copyright © 2007-2020 广东宝晨空调科技有限公司 All Rights Reserved 粤ICP备2022107769号
友情链接: 成都响应式网站建设公司 四川成都网站建设 温江网站设计 网站设计 成都网站设计 营销型网站建设 盐亭网站设计 成都网站设计公司 成都网站建设流程 重庆手机网站建设 成都网站制作 成都网站建设 四川成都网站设计 企业网站制作 企业网站设计 网站设计 成都商城网站建设 成都响应式网站建设 成都网站建设 网站设计制作 LED网站设计方案 app网站建设