小程序定位

作小程序有四個月的時間，對小程序的認知仍是比較淺的，小程序已上線，正好有空餘時間總結一下。=.=

門店定位

門店定位用到了百度地圖，先說一下怎麼實現定位的，貼代碼

var bmap = require('../libs/bmap-wx.min.js');
// 獲取定位信息
getLocation() {
  let that = this;
  let BMap = new bmap.BMapWX({
    ak: that.$parent.globalData.appInfo.ak
  });
  //定位失敗或是拒絕定位受權
  let fail = function (data) {
    let _info = {
      title: '提示',
      content: "未定位到門店，請選擇門店",
      confirmText: '選擇門店',
      showCancel: false,
      success(res) {
        if (res.confirm) {
          wx.reLaunch({
            url: './location'
          })
        }
      }
    };
    wx.showModal(_info);
    //that.matchNearmall();
  };
  let success = function (data) {
    //返回數據內，已經包含經緯度 
    //使用wxMarkerData獲取數據
    let wxMarkerData = data.wxMarkerData;
    //把全部數據放在初始化data內 
    that.$parent.globalData.locationInfo = {
      latitude: wxMarkerData[0].latitude,
      longitude: wxMarkerData[0].longitude,
      address: wxMarkerData[0].address,
      cityInfo: data.originalData.result.addressComponent
    };
    if (data) {
      // 獲取到經緯度傳給後臺匹配最近門店並返回當前門店的信息
      that.gthomeInfo(that.$parent.globalData.locationInfo);
    }
  }
  //發起regeocoding檢索請求   
  BMap.regeocoding({
    fail: fail,
    success: success
  });
}
複製代碼

目前定位門店並獲取門店信息的流程是
百度地圖api 下載連接

1. 在百度api虎鯨數據手動添加對應門店信息位置
2. 引入百度地圖api
3. 在文件中引入var bmap = require('./libs/bmap-wx.min.js')
4. 匹配附近門店

代碼實現

var bmap = require('./libs/bmap-wx.min.js')
getLocation () {
    // 
    let Bmap = new bmap.BMapWX({
      ak: this.globalData.appInfo.ak
    })
    Bmap.regeocoding({
      fail: res => {
        console.log(res)
      },
      success: res => {
        console.log(res)
        let wxMarkerData = res.wxMarkerData
        wx.setStorageSync('location', {
          longitude: wxMarkerData[0].longitude,
          latitude: wxMarkerData[0].latitude,
          address: wxMarkerData[0].address,
          addressComponent: res.originalData.result.addressComponent
        })
        this.nearLocationInfo()
      }
    })
  }
  // 匹配附近
  nearLocationInfo() {
    wx.request({
      url: 'http://api.map.baidu.com/geosearch/v3/nearby?ak=nqcYH1wuDwhloiynnROqx2jDAXdkBPln',
      data: {
        geotable_id: this.globalData.appInfo.geotable_id,
        location: wx.getStorageSync('location').longitude + ',' + wx.getStorageSync('location').latitude,
        radius: 1000000,
        sortby: 'distance:1',
        page_index: 0,
        page_size: 10
      },
      success: data => {
        console.log(data)
        // 調用成功以後獲取第一個數據就是附近的定位
        // 由於sortby給定順序
      }
    })
  }
  onLaunch() {
    this.getLocation()
  }
複製代碼

不知道你們怎麼實現的，有比較好的意見，歡迎你們提議。

小程序我使用了wepy組件 使用過程當中 也會遇到不少坑。有時跳轉有問題 在最終仍是使用小程序原生組件。 問題說的比較籠統，下面我總結一下本身用到的功能展示。我也是初識小程序，在項目中也是不斷挖坑填坑，技術還不到家 有問題的話，但願你們指出~_~

微信小程序swiper輪播圖卡死來回瘋狂輪播