俗話說得好:弱,就得多練!
【想法來源】
為了多鍛煉自己,我開始寫這個小玩意,之前逛聚合數據這個網站的時候,發現他有個天氣的API,我就想寫個可以用的小應用。所以花了一個晚上東平西湊總算搞出來了。
【技術基礎】
我的網站用了riotJs這個框架,所以在展示數據的時候會方便點(不知道什么是riotJS的可以看這里)但是那個跟這篇文章沒關系;我主要介紹一些開發中比較有用的東西。
【正文】
一開始本來想選一張好看點的圖片做背景,但是總感覺少了什么,我想既然是天氣,那就來個下雨效果吧,所以就用了這個;使用方法見官網吧,我也是按照那個來的,我就是調整了下參數。
2、URI二次轉碼
天氣api需要兩個參數,一個是key,這個是開發中獨有的,你們不用管,另一個就是cityname,一開始請求成功但是總是顯示cityname出錯查找不到城市,當時心想妹的這個城市都找不到,后來才發現發送過去的參數中cityname變了樣,譬如我輸入'溫州',本來應該是這個樣子的:
%E6%B8%A9%E5%B7%9E
,但是發送過去的數據變成這樣了:
%25E6%25B8%25A9%25E5%25B7%259E
這說明二次轉碼了,解決辦法就是:
tianqiData.cityname = decodeURI(encodeURI(tianqiData.cityname));
(不用管變量名,這個是我從我源碼中拷貝出來的)
3、input的outline
在使用背景圖片后,再用input文本類型的標簽,鼠標點擊會出現一個亮框,好丑。這時候只要給input設置這個樣式:
outline: none;
【效果圖】
【應用網址】
有不好的地方可以跟我反饋