2023年夏季《移动软件开发》实验报告
姓名和学号? | |
---|---|
本实验属于哪门课程? | 中国海洋大学23夏《移动软件开发》 |
实验名称? | 实验2:天气查询小程序 |
博客地址? | XXXXXXX |
Github仓库地址? | XXXXXXX |
(备注:将实验报告发布在博客、代码公开至 github 是 加分项,不是必须做的)
一、实验目标
1、掌握服务器域名配置和临时服务器部署;2、掌握 wx.request 接口的用法。
二、实验步骤
列出实验的关键步骤、代码解析、截图。
注册账号
https://dev.qweather.com/
之后得到了 k e y key key
api调用方法
https://devapi.qweather.com/v7/weather/3d?location=101010100&key=这里替换成你的key
小程序配置服务器域名
在开发管理中找到并配置好 r e q u e s t request request合法域名
下载和风天气的图标
https://dev.qweather.com/docs/resource/icons/
并放到项目中
选择器
mode=region
就可以直接显示地区信息
完成静态页面
添加逻辑函数
但是,此时通过picker只能得到选择的城市文字内容,需要转成locationID才可以使用,所以在微信公众平台添加域名https://geoapi.qweather.com
getLocationId() {
return new Promise((resolve, reject) => {
let that = this;
wx.request({
url: 'https://geoapi.qweather.com/v2/city/lookup?',
data: {
location: that.data.region[1],
adm: that.data.region[0],
key: 'e21f318045b848e29f6b1b1634dbe163'
},
success: (res) => {
console.log("getLocationId", res.data);
that.setData({
locationId: res.data.location[0].id
});
resolve(); // 解析 Promise
},
fail: (error) => {
reject(error); // 拒绝 Promise 并传递错误
}
});
});
}
完成locationId
的编写,需要封装成promise对象,才能在使用.then()
方法
三、程序运行结果
默认情况
选择完地区之后
列出程序的最终运行结果及截图。
四、问题总结与体会
getWeather()
和getLocationId()
有异步问题,并且使用then()解决不了:将getLocationId()
封装成 p r o m i s e promise promise对象
描述实验过程中所遇到的问题,以及是如何解决的。有哪些收获和体会,对于课程的安排有哪些建议。