java 显示天气的小程序_超级简单的微信小程序获取今日天气预报代码 小程序获取七日天气...
代碼是天氣api的小程序demo, 粘貼上js和wxml就可以運行看效果了, 有問題的加我qq 445899710, 可提供源代碼, 效果如圖
如果是測試, 請勾選配置?不校驗合法域名、web-view(業(yè)務(wù)域名)、TLS 版本以及 HTTPS 證書
如果正式使用, 請?zhí)砑影踩蛎麅蓚€ (tianqiapi.com)
index.js代碼
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
//index.js
//獲取應(yīng)用實例
const app = getApp()
Page({
data: {
weather: {?'wea_img':?'qing'},//實況天氣
weatherweek:[],//七日天氣
},
onLoad:?function?() {
this.getapi();
},
getapi:function(){
var?_this =?this;
// 獲取IP地址
wx.request({
url:?'https://tianqiapi.com/ip/',
data: {
},
method:?'POST',
header: {
'content-type':?'application/x-www-form-urlencoded'
},
success:?function?(res) {
console.log(res);
// 根據(jù)IP獲取天氣數(shù)據(jù)
_this.weathertoday(res.data.ip);_this.weatherweekday(res.data.ip);
}
});
},
// 天氣api實況天氣
weathertoday:function(ip){
var?_this =?this;
wx.request({
url:?'https://www.tianqiapi.com/api/?version=v6',
data: {
'ip': ip
},
method:?'GET',
header: {
'content-type':?'application/x-www-form-urlencoded'
},
success:?function?(res) {
_this.setData({
weather: res.data
});
console.log(_this.data.weather)
}
});
},
// 天氣api實況天氣
weatherweekday:?function?(ip) {
var?_this =?this;
wx.request({
url:?'https://www.tianqiapi.com/api/?version=v1',
data: {
'ip': ip
},
method:?'GET',
header: {
'content-type':?'application/x-www-form-urlencoded'
},
success:?function?(res) {
_this.setData({
weatherweek: res.data
});
console.log(_this.data.weatherweek)
}
});
}
})
wxml代碼
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
天氣api - 小程序示例
{{weather.city}}實況天氣預(yù)報
氣象臺 {{weather.update_time}} 更新
{{weather.tem}}℃ {{weather.wea}}
{{weather.win}} {{weather.win_speed}} {{weather.win_meter}}
濕度: {{weather.humidity}}
能見度: {{weather.visibility}}
氣壓: {{weather.pressure}}hPa
空氣質(zhì)量 {{weather.air_level}}
{{weather.air_tips}}
{{weather.city}}七日天氣
{{item.day}} - {{item.wea}} - {{item.win[0]}} - {{item.tem1}}/{{item.tem2}}
TianqiAPI.com
CSS代碼
1
2
3
4
5
.container {
height:?100%;
text-align:center;?background:#f6f8f8;?padding:20rpx;font-size:16px;
}
.padb{padding-bottom:?15rpx;}
小程序源碼下載:?https://pan.baidu.com/s/1jIPAtU1Q-EH6I18ud9pNvw?提取碼 s8tm
--? 轉(zhuǎn)載的別人的文章(https://www.cnblogs.com/ccjin/p/10684924.html)-- 因為轉(zhuǎn)載不過來 所以就復(fù)制了
總結(jié)
以上是生活随笔為你收集整理的java 显示天气的小程序_超级简单的微信小程序获取今日天气预报代码 小程序获取七日天气...的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： java中map集合的修改_map集合修
- 下一篇： mysql数据库管理文件_数据库管理中文