简介
weather-hui 是一款前端基于 npm 包的天气查询插件，可以方便地通过编程方式获取不同城市的天气信息。
安装
使用 npm 进行安装：
--- ------- ----------- ------
使用方法
初始化
在使用 weather-hui 之前，需要先对其进行初始化。
----- ------- - -----------------------
------- -------
----- ------- - -
-------- -----
--
----- ------------- - --- -----------------你需要传入你所使用的 API_KEY ，该插件使用的是 和风天气接口 提供的天气数据。
获取天气信息
接着，就可以根据城市名来获取天气信息了。
------------------------------ ------------- -------- -
-- ----- -
-------------------
- ---- -
---------------------
-
---其中的 getWeather 方法需要传入两个参数，第一个表示所查询天气的城市名称，第二个则是回调函数，其参数中，err 表示是否有出错信息，weather 则表示获取到天气的信息。
天气信息格式
获取到天气信息后，其格式如下：
-
-------- - ------
------ -------------- ------
----------- ----- ------
-------------- ----- ------
------------- ----- --------
------- ----- ------
------ -------------- ------
------ --------------- ------
----- ------- -----------
--
--------- - ------
------ ----------- ------- ------
------ ----------- ------ -------
--
--------- ----- -------
------ - ------
-------- ---- ----
------------ ------ --------
----------- ---- --------
----- ----- ------
------ ----- ------
------- ------ -----
------- ------- ------
------ ----- ----
------ ----- -----
----------- ------ ---------
----------- ------ ----
---------- ---- ----
----------- ---- ----------
-
-天气变量
返回的天气信息中，包含多个变量，以下是各变量的描述：
| 变量名 | 描述 |
|---|---|
| basic | 城市基本信息 |
| cid | 城市 ID |
| location | 城市名称 |
| parent_city | 该城市的上级城市 |
| admin_area | 所属行政区域 |
| cnty | 国家名称 |
| lat | 城市纬度 |
| lon | 城市经度 |
| tz | 城市所在时区偏移量 |
| update | 更新时间信息 |
| loc | 当地时间 |
| utc | UTC 时间 |
| status | 返回状态码 |
| now | 实况天气 |
| cloud | 云量，百分比 |
| cond_code | 实况天气状况代码，如 “100” 为晴天 |
| cond_txt | 实况天气状况描述，如 “晴” |
| fl | 体感温度 |
| hum | 相对湿度，百分比 |
| pcpn | 降水量，毫米 |
| pres | 大气压强，百帕 |
| tmp | 温度，摄氏度 |
| vis | 能见度，公里 |
| wind_deg | 风向360角度 |
| wind_dir | 风向 |
| wind_sc | 风力 |
| wind_spd | 风速，公里/小时 |
示例代码
下面的代码演示了如何获取上海今天的天气信息。
----- ------- - -----------------------
----- ------- - -
-------- -----
--
----- ------------- - --- -----------------
------------------------------ ------------- -------- -
-- ----- -
-------------------
- ---- -
----------------- - ------------------------
----------------- - --------------- - -----
------------------- - ----------------------
------------------- - --------------- - -----
----------------- - ------------------- - -----
------------------ - --------------- - ------
-
---输出结果如下：
----- ------ ------- -------- ----- --------
小结
通过本文，我们了解了 weather-hui 这个插件的使用方法，并通过示例代码，展示了如何获取天气信息。如果您需要在自己的项目中获取天气信息，那么 weather-hui 就是一个不错的选择。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600562ee81e8991b448e0a5d