天气接口

src/components2/weather/index.vue

@@ -4,7 +4,7 @@
       <el-image :src="weather1" fit="scale-down" />
       <div class="name">温度</div>
       <div class="num">
-        27
+        {{data.temperature}}
         <div class="unit">℃</div>
       </div>
     </el-col>
@@ -12,7 +12,7 @@
       <el-image :src="weather2" fit="scale-down" />
       <div class="name">湿度</div>
       <div class="num">
-        60
+        {{data.sd}}
         <div class="unit">%RH</div>
       </div>
     </el-col>
@@ -20,13 +20,14 @@
       <el-image :src="weather3" fit="scale-down" />
       <div class="name">PM2.5</div>
       <div class="num">
-        3
+        {{data.aqiDetail.pm2_5}}
         <div class="unit">ug/m3</div>
       </div>
     </el-col>
   </el-row>
 </template>
 <script>
+import axios from 'axios'
 import weather1 from "@/assets/images2/温度.png";
 import weather2 from "@/assets/images2/湿度.png";
 import weather3 from "@/assets/images2/pm2.5.png";
@@ -37,8 +38,27 @@ export default {
       weather1: weather1,
       weather2: weather2,
       weather3: weather3,
+      data:{
+        aqiDetail:{}
+      }
     };
   },
+  created(){
+    this.initData()
+  },
+  methods: {
+    //初始化数据
+    initData() {
+      axios({
+            method: 'get',
+            url: 'https://smartpark.caih.com/dxapi/aliWeather?area=南宁',
+            timeout: 3000,
+        }).then(res =>{
+            this.data = res.data.showapi_res_body.now
+        }).catch(err =>{
+        })
+    },
+  }
 };
 </script>
 <style lang="scss" scoped>

src/views/index.vue

@@ -18,8 +18,8 @@
           </el-col>
         </el-col>
         <el-col  id="middleWrap" >
-          <iframe  style="width:100%;height:100%;border:none;" id="iframe" src='http://www.thingjs.com/s/ef7ee6a73896c01bda77e679?params=105b0f77fd24654d4eebc434e9'></iframe>
-          <!-- <iframe  style="width:100%;height:100%;border:none;" id="iframe" src='http://10.21.39.6:9000/'></iframe> -->
+          <!-- <iframe  style="width:100%;height:100%;border:none;" id="iframe" src='http://www.thingjs.com/s/ef7ee6a73896c01bda77e679?params=105b0f77fd24654d4eebc434e9'></iframe> -->
+          <iframe  style="width:100%;height:100%;border:none;" id="iframe" src='http://10.21.39.6:9000/'></iframe>
         </el-col>
         <el-col  class="rightWrap">
           <weather alt="天气"/>