用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,登录网站

小程序社区 首页 教程 实战教程 查看内容

小程序 - 可搜索的地址选择

Rolan 2019-11-20 00:41

最终实现效果:新建index文件夹index.wxml!--pages/index/index.wxml--view class='container' view bindtap='onChangeAddress' input value="{{address}}" name="address" placeholder="选择地点" /view/viewindex. ...

最终实现效果:

新建index文件夹

index.wxml

  1. <!--pages/index/index.wxml-->
  2. <view class='container'>
  3. <view bindtap='onChangeAddress'>
  4. <input value="{{address}}" name="address" placeholder="选择地点">
  5. </view>
  6. </view>

index.js

  1. // pages/index/index.js
  2. Page({
  3. data: {
  4. address: ''
  5. },
  6. onChangeAddress() {
  7. var _page = this;
  8. wx.chooseLocation({
  9. success: (res) => {
  10. _page.setData({
  11. address: res.name
  12. });
  13. },
  14. fail: (err) => {
  15. console.log(err);
  16. }
  17. });
  18. }
  19. })

新建map文件夹

map.wxml

  1. <!--pages/map/map.wxml-->
  2. <view class="container">
  3. <map
  4. id="myMap"
  5. style="width: 100%; height: 100%;"
  6. latitude="{{latitude}}"
  7. longitude="{{longitude}}"
  8. markers="{{markers}}"
  9. show-location
  10. ></map>
  11. </view>

map.js

  1. // pages/map/map.js
  2. Page({
  3. data: {
  4. latitude: 31.22786,
  5. longitude: 121.46658,
  6. markers: [{
  7. id: 1,
  8. latitude: 31.22786,
  9. longitude: 121.46658,
  10. name: '上海招商局广场'
  11. }]
  12. },
  13. onReady(e) {
  14. this.mapCtx = wx.createMapContext('myMap')
  15. }
  16. })
鲜花
鲜花
鸡蛋
鸡蛋
分享至 : QQ空间
收藏
原作者: 可怜的小黑兔 来自: 简书