天气2222222222222222

wxml

<view class="contect">

  <picker mode="region" bindchange="region">

    {{region}}

  </picker>

  <view>

    {{now.text}} {{now.temp}}℃

  </view>

  <view>

    <!-- <image src="../../image/1.1.0/icons/100.svg"></image> -->

    <image src="../../image/1.1.0/icons/{{now.icon}}.svg"></image>

  </view>

  <view class="bar">

    <view class="box">湿度</view>

    <view class="box">气压</view>

    <view class="box">能见度</view>

  </view>

  <view class="bar">

    <view class="box">{{now.humidity}}%</view>

    <view class="box">{{now.pressure}}hPa</view>

    <view class="box">{{now.vis}}km</view>

  </view>

  <view class="bar">

    <view class="box">风向</view>

    <view class="box">风速</view>

    <view class="box">风力</view>

  </view>

  <view class="bar">

    <view class="box">{{now.windDir}}</view>

    <view class="box">{{now.windSpeed}}km/h</view>

    <view class="box">{{now.windScale}}级</view>

  </view>

</view>

wxss

/* pages/index2/index2.wxss */

.contect{

  height: 100vh;

  display: flex;

  align-items: center;

  flex-direction: column;

  justify-content: space-around;

  width: 100vw;

}

.bar{

  display: flex;

  flex-direction: row;

justify-content: space-around;

margin: 20rpx 0;

align-items: center;

}

.box{

  /* margin: 20rpx; */

width: 33.3vw;

text-align: center;

}

js

// pages/index2/index2.js

Page({

  /**

   * 页面的初始数据

   */

  data: {

    region:["辽宁省","沈阳市","大东区"],

    now: ""

  },

  region: function (e) {

    console.log(e);

    this.setData({

      region: e.detail.value

    })

    this.getweater()

  },

  getweater: function () {

    var that = this

    wx.request({

      url: 'https://geoapi.qweather.com/v2/city/lookup?',

      data: {

        location: this.data.region[2],

        adm: this.data.region[1],

        key: '9e8aa9f791b34dbaa4d507202edc359e'

      },

      success: function (rs) {

        console.log(rs)

        console.log(rs.data.location[0].id);

        var idd = rs.data.location[0].id

        wx.request({

          url: 'https://devapi.qweather.com/v7/weather/now?',

          data: {

            location: idd,

            key: '9e8aa9f791b34dbaa4d507202edc359e'

          },

          success: function (res) {

            console.log(res);

            that.setData({

              now: res.data.now

            })

          }

        })

      }

    })

  },

  /**

   * 生命周期函数--监听页面加载

   */

  onLoad: function (options) {

    this.getweater()

  },

  /**

   * 生命周期函数--监听页面初次渲染完成

   */

  onReady: function () {

  },

  /**

   * 生命周期函数--监听页面显示

   */

  onShow: function () {

  },

  /**

   * 生命周期函数--监听页面隐藏

   */

  onHide: function () {

  },

  /**

   * 生命周期函数--监听页面卸载

   */

  onUnload: function () {

  },

  /**

   * 页面相关事件处理函数--监听用户下拉动作

   */

  onPullDownRefresh: function () {

  },

  /**

   * 页面上拉触底事件的处理函数

   */

  onReachBottom: function () {

  },

  /**

   * 用户点击右上角分享

   */

  onShareAppMessage: function () {

  }

})