uniapp vue 获取天气数据
vue
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
项目地址:https://gitcode.com/gh_mirrors/vu/vue
免费下载资源
·
获取当前地址,通过高德天气数据,来展示天气温度风度等数据
//获取天气
getWeather(){
// 获取天气预报
uni.request({
url: 'https://restapi.amap.com/v3/weather/weatherInfo',
data: {
city: '长沙',
// extensions:'all',
key: 'xxxxxxxxxx'//自己的高德密钥key
},
success:(pp)=>{
uni.hideLoading()
console.log('天气信息:',pp);
// console.log('天气信息:', weatherData[0]);
if(pp.data){
//匹配显示对应的天气图片
let weather = pp.data.lives[0].weather;
for(let key in weatherObj){
if(weatherObj[key].indexOf(weather) != -1){
that.weatherImg = `/static/image/${key}.png`;//对应天气的图片,用自己的
}
}
console.log('最后的结果',that.weatherImg)
if(!that.weatherImg){
that.weatherImg = '/static/image/yingtian.png';
}
that.lives = pp.data.lives[0];
}
},
fail:(error)=>{
uni.hideLoading()
uni.showToast({title:'天气信息获取失败'})
}
});
},
weatherObj的数据,高德所有的天气名称,可以自行调整
export default {
//晴天
qingtian:['晴','少云','晴间多云 '],
//多云
duoyun:['多云'],
//下雪
xiaxue:['雪','阵雪','小雪','中雪','大雪','暴雪','小雪-中雪','中雪-大雪','大雪-暴雪'],
//雨加雪
yujiaxue:['雨雪天气','雨夹雪','阵雨夹雪'],
//雷阵雨
leizhengyu:['雷阵雨','雷阵雨并伴有冰雹','强雷阵雨',],
//阵雨
zhengyu:['阵雨','强阵雨'],
//下雨
xiayu:['小雨','中雨','大雨','暴雨','大暴雨','特大暴雨','毛毛雨/细雨','雨','小雨-中雨','中雨-大雨','大雨-暴雨','暴雨-大暴雨','大暴雨-特大暴雨','冻雨'],
//阴天
yingtian:['阴','有风','平静','微风','和风','清风','强风/劲风','疾风','大风','烈风','风暴','狂爆风','飓风','热带风暴','霾','中度霾','重度霾','严重霾','浮尘','扬沙','沙尘暴','强沙尘暴','龙卷风','雾','浓雾','强浓雾','轻雾','大雾','特强浓雾','热','冷','未知'],
}
GitHub 加速计划 / vu / vue
82
16
下载
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
最近提交(Master分支:4 个月前 )
9e887079
[skip ci] 3 个月前
73486cb5
* chore: fix link broken
Signed-off-by: snoppy <michaleli@foxmail.com>
* Update packages/template-compiler/README.md [skip ci]
---------
Signed-off-by: snoppy <michaleli@foxmail.com>
Co-authored-by: Eduardo San Martin Morote <posva@users.noreply.github.com> 6 个月前
更多推荐
已为社区贡献5条内容
所有评论(0)