vue 免费的每天不限次数的调用天气接口

文档：360免费天气API接口.note
链接：http://note.youdao.com/noteshare?id=8333c579b80f71e91a4156745fde5b27&sub=2E539D6ADEE047AB8653FB87EAD12E8E

created() {
// 开始设置时间
if (this.timeInterval) {
clearInterval(this.timeInterval);
} else {
this.timeInterval = setInterval(() => {
this.showTime()
}, 1000);
}
},
destroyed() {
clearInterval(this.timeInterval);
},
data() {
return {
timeInterval: null, //时间循环
nowTemp: ‘’, //当前温度
nowWeek: ‘’, //当前日期
nowTime: ‘’, //当前时间
weatherInfo: ‘’, //天气情况
minMaxTemp: ‘’, //最低、最高气温
airQuality: ‘’, //空气质量
humidity: ‘’, //湿度
weatherIcon: ‘’, //天气图标
};
},
getWeather(){
this.$fetchJsonp(
“http://cdn.weather.hao.360.cn/sed_api_weather_info.php?app=360chrome&code=101230101”,
{jsonpCallback: “_jsonp”}
)
.then((response) => {
return response.json();
})
.then((data) => {
//当前温度
this.nowTemp = data.realtime.weather.temperature;
//天气情况
this.weatherInfo = data.realtime.weather.info;
//湿度
this.humidity = data.realtime.weather.humidity;
//最低气温、最高气温
let minTemp = data.weather[0].info.dawn[2];
let maxTemp = data.weather[0].info.day[2];
this.minMaxTemp = minTemp + '℃ – ’ + maxTemp + ‘℃’;
//空气质量
let pm25 = data.pm25.pm25[0];
if (pm25 <= 35) {
this.airQuality = ‘优’;
} else if (pm25 <= 75) {
this.airQuality = ‘良’;
} else if (pm25 <= 115) {
this.airQuality = ‘轻度污染’;
} else if (pm25 <= 150) {
this.airQuality = ‘中度污染’;
} else if (pm25 <= 250) {
this.airQuality = ‘重度污染’;
} else {
this.airQuality = ‘严重污染’;
}
//天气图标
switch (this.weatherInfo) {
case ‘小雪’:
this.weatherIcon = ‘weather-xiaoxue’;
break;
case ‘暴雪’:
this.weatherIcon = ‘weather-baoxue’;
break;
case ‘暴雨’:
this.weatherIcon = ‘weather-baoyu’;
break;
case ‘大雪’:
this.weatherIcon = ‘weather-daxue’;
break;
case ‘大雨’:
this.weatherIcon = ‘weather-dayu’;
break;
case ‘冻雨’:
this.weatherIcon = ‘weather-dongyu’;
break;
case ‘多云’:
this.weatherIcon = ‘weather-duoyun’;
break;
case ‘浮尘’:
this.weatherIcon = ‘weather-fuchen’;
break;
case ‘暴雪’:
this.weatherIcon = ‘weather-baoxue’;
break;
case ‘雷阵雨’:
this.weatherIcon = ‘weather-leizhenyu’;
break;
case ‘霾’:
this.weatherIcon = ‘weather-mai’;
break;
case ‘晴’:
this.weatherIcon = ‘weather-qing’;
break;
case ‘沙尘暴’:
this.weatherIcon = ‘weather-shachenbao’;
break;
case ‘霜’:
this.weatherIcon = ‘weather-shuang’;
break;
case ‘特大暴雨’:
this.weatherIcon = ‘weather-tedabaoyu’;
break;
case ‘雾’:
this.weatherIcon = ‘weather-wu’;
break;
case ‘小雨’:
this.weatherIcon = ‘weather-xiaoyu’;
break;
case ‘小雨转晴’:
this.weatherIcon = ‘weather-xiaoyuzhuanqing’;
break;
case ‘雪转晴’:
this.weatherIcon = ‘weather-xuezhuanqing’;
break;
case ‘扬沙’:
this.weatherIcon = ‘weather-yangsha’;
break;
case ‘阴’:
this.weatherIcon = ‘weather-yin’;
break;
case ‘雨夹雪’:
this.weatherIcon = ‘weather-yujiaxue’;
break;
case ‘阵雪’:
this.weatherIcon = ‘weather-zhenxue’;
break;
case ‘阵雨’:
this.weatherIcon = ‘weather-zhenyu’;
break;
case ‘中雪’:
this.weatherIcon = ‘weather-zhongxue’;
break;
case ‘中雨’:
this.weatherIcon = ‘weather-zhongyu’;
break;
default:
this.weatherIcon = ‘weather-duoyun’;
}
})
.catch((ex) => {
console.log(“weather error”,ex);
})
},
showTime() {
//日期、时间
let date = new Date();
let year = date.getFullYear();
let month = date.getMonth() + 1 < 10 ? “0” + (date.getMonth() + 1) : date.getMonth() + 1;
let day = date.getDate() < 10 ? “0” + date.getDate() : date.getDate();
let hour = date.getHours() < 10 ? “0” + date.getHours() : date.getHours();
let minute = date.getMinutes() < 10 ? “0” + date.getMinutes() : date.getMinutes();
let second = date.getSeconds() < 10 ? “0” + date.getSeconds() : date.getSeconds();
let todayDate = year + “年” + month + “月” + day + “日”;
let todayWeek = “星期” + (“天一二三四五六”.charAt(date.getDay()));
this.nowWeek = todayDate + " " + todayWeek;
this.nowTime = hour + “:” + minute + “:” + second;
},

     

      

        

      
      

        

          
{{ nowTemp }}℃
          
{{ nowWeek }}
          
{{ nowTime }}
        
        

          

            
            {{ weatherInfo }}
            {{ minMaxTemp }}
          
          

            
            空气质量：
            {{ airQuality }}
          
          

            
            湿度：
            {{ humidity }}%
          
        
      
    
  

package.json文件中
“fetch-jsonp”: “^1.2.3”,

main.js文件中
import fetchJsonp from "fetch-jsonp"
Vue.prototype.$fetchJsonp = fetchJsonp;