微信小程序通过获取地理位置查看天气-Toy模板网

这篇具有很好参考价值的文章主要介绍了微信小程序通过获取地理位置查看天气。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

微信小程序通过获取地理位置查看天气

1.在app.json中写入

"permission": {
    "scope.userLocation": {
      "desc": "你的位置信息将用于天气预报定位"
    }
  }

2.申请和风天气APIKEY 和风天气开发平台 ~ 高效强大的天气API，天气SDK和天气插件

3.在js文件中设置变量

 const APIKEY = "APIKEY"; //申请到的和风天气key

4.获取天气代码

  //获取天气
  getWeather() {
    var that = this
    wx.getLocation({
      type: 'gcj02',
      success(res) {
        that.setData({
          location: res.longitude + "," + res.latitude
        })
        that.getCityByLoaction()
        that.weather()
      }
    })
  }

5.根据坐标获取城市

 getCityByLoaction() {
    var that = this
    wx.request({
      url: 'https://geoapi.qweather.com/v2/city/lookupkey=' + APIKEY + "&location=" + that.data.location,
      success(result) {
        var res = result.data
        if (res.code == "200") {
          var data = res.location[0]
          that.setData({
            City: data.adm2,
            Province: data.adm1
          })
        } else {
          wx.showToast({
            title: '获取城市信息失败',
            icon: 'none'
          })
        }
      }
    })
  }

6.获取天气情况

 weather() {
    var that = this
    wx.showLoading({
      title: '加载中',
    })
    wx.request({
      url: 'https://devapi.qweather.com/v7/weather/nowkey=' + APIKEY + "&location=" + that.data.location,
      success(result) {
        var res = result.data
        that.setData({
          temp: res.now.temp,
          text: res.now.text,
          icon: res.now.icon
        })
      }
    })
    wx.hideLoading()
  }

结束啦。文章来源地址https://www.toymoban.com/news/detail-491049.html

到了这里，关于微信小程序通过获取地理位置查看天气的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！