小程序获取定位位置-蒲公英云

小程序获取定位位置

男娘i 2022-10-25 15:25 377阅读 0赞

wxml:

<view class="location">推荐</view>
 <button  class="getLocation" bindtap="getLocation" size='mini'>定位</button>
 <view class="hotCity">热门城市</view>
 <button class="btn"  size="mini" wx:for="{ {hotCitys}}"
 wx:key="index" >{ { item}}</button>

js：

data: {  
     hotCitys:["北京", "上海",  "深圳",  "广州",  "武汉",  "荆州",  "荆门"]
  },
  getLocation:function(){ 
      wx.getLocation({  
        success:res=>{ 
          console.log(res);
          wx.request({ 
            url: 'http://iwenwiki.com:3002/api/lbs/location',
            data:{ 
              latitude:res.latitude,
              longitude:res.longitude 
           }, 
           success:result=>{ 
             console.log(result);
             var   cityName=result.data.result.ad_info.city.slice(0,2);
             console.log(cityName);
             //跳转----食疗坊界面 --把数据传递过去。
             wx.navigateTo({ 
               url: '../food/food',
             })
           }
          })
        }
      })
  },

wxss:

/* pages/citys/citys.wxss */
.location,.hotCity{ 
  padding:20rpx;
  font-weight: bold;
  font-size: 36rpx;
}
.getLocation{ 
  color: green;
  margin-top:20rpx;
  background: #eee;
}
.btn{ 
  margin: 10rpx;
  font-weight: normal;
  border-radius: 10rpx;
  background: #fff;
  border: 1px  solid  #999;
  font-size: 30rpx !important;
  padding: 4rpx  16rpx  !important;
}