《校内实训日志》DAY 07

实训DAY 07 日志

今日实现天气预报页面，进入页面自动获取当前位置的天气信息。

 

首先实现自动定位

//wx获取位置接口

    wx.getLocation({

      success: function(res) {

        //获取经纬度

        console.log(res);

通过腾讯地图位置服务的逆地址解析解析当前位置的ip

//逆地址解析

        qqmapsdk.reverseGeocoder({

          location:{

            latitude:res.latitude,

            longitude:res.longitude

          },

          success:function(res){

            console.log(res.result.address_component.district.substr(0,2));

            _this.weathertoday(res.result.address_component.district.substr(0, 2));

            _this.weatherweekday(res.result.address_component.district.substr(0, 2));

          }

        })

将获取的ip传值到相关的获取实况天气接口

//天气api实况天气

  weathertoday:function(city){

    var _this = this;

    wx.request({

      url: 'https://www.tianqiapi.com/api/?version=v6',

      data:{

        'city':city

      },

      method:'GET',

      header:{

        'content-type':'application/x-www-form-urlencoded'

      },

      success:function(res){

        console.log(res.data.date.substr(5,5));

        _this.setData({

          weather:res.data,

          date:res.data.date.substr(5,5),

          humidity:res.data.humidity.substr(0,2)

        });

        console.log("今日天气 =>",_this.data.weather)

      }

    });

  },

  // 天气api实况天气

  weatherweekday:function(city){

    var _this = this;

    wx.request({

      url:'https://www.tianqiapi.com/api/?version1',

      data:{

        'city':city

      },

      method:'GET',

      header:{

        'content-type':'application/x-www-form-urlencoded'

      },

      success:function(res){

        _this.setData({

          weatherweek:res.data

        });

        console.log("7日天气 =>",_this.data.weatherweek)

      }

});

以及实现搜索栏输入地址获取输入地址的天气

var _this = this;

    //console.log(e.detail.value);

    if(e.detail.value.length != 0){

      _this.weathertoday(e.detail.value);

      _this.weatherweekday(e.detail.value);

      // 情况输入框的值

      _this.setData({

        value:''

      })

    }

实现页面：