很久沒寫過筆記一類的東西了，從剛開始的996持續半年，直到最近，剛好這幾天有空，順便總結一下開發小程序的一些心路歷程。
在這里呢順便打個廣告，小程序名字叫“一拍即傳”。
最近半年多呢一直在開發小程序，其實小程序跟傳統的web開發是極其相似的，當然也有不少不同的點，接下來 進入正題：
一開始學習小程序的第一步當然是看官方文檔咯。
首先 先說說結構部分，結構部分的代碼 當然跟傳統的H5語法一樣
在這里，H5 與 小程序的相同點 與 不同點，想必作為前端也一目了然了，同樣的語法，不同的標簽，比如圖中 view 標簽類似於 H5里面的div標簽。
text標簽 類似於 span一類的 常用的放置文案的標簽。 image相當於強化版的img標簽。
當然從圖中，觀眾朋友們也能看到 除了標簽不一樣以外，有的標簽上的屬性 也是H5中沒有的，例如image上面的 mode ，用於規定圖片填充和裁剪的方式。
hidden =“{{something}}” 是否隱藏此元素，somthing為true時隱藏。變量通過{{}}括起來，使用過某某前端框架的朋友看見這種語法是不是很熟悉呢？
再比如 view上的 hover-class 點擊態樣式， 在這里就不具體挨個贅述了，文檔上有很詳細的描述，一個點舉一個例子就行了。
view 上的 bindtap 當然顧名思義了 綁定點擊事件。
js部分：
import {something} from "where" // 這個大家一定很熟悉了
Page（{
data:{//data里的變量可直接綁定到頁面結構上，理同上圖中的errorView
something:''，
errorView:false
}
//下面是頁面所需要用到的方法
onLoad(){
//to do something
this.setData({
something:'我是頁面所需的數據，可同過setData來修改'
})
}
todosomething(){
let test = 222
}
}）
在上面中的 onLoad 大家肯定注意到了，接下來看看小程序的生命周期：
onLaunch：小程序初始化
onLoad： 頁面加載時
onReady：頁面渲染完成時 (我個人在項目中的使用頻率不高)
onShow：頁面顯示時
onHide：頁面隱藏時
onUnload：頁面卸載時
在這里呢 有的盆友可能有些疑問，onShow 和 onLoad 的區別？
在第一次進入A頁面時，onLoad onReady onShow 都會執行
在實際業務場景下，經常存在從下一個頁面，返回到上一個頁面的情況。
wx.navigateTo(OBJECT)：保存當前頁面，跳轉到小程序內某個頁面 //使用頻率較高
注意了：通過navigateTo是會保存當前頁面的，當A->B 再從B->A回來的時候 就會執行 onShow里面的代碼 而不會執行onLoad里面的代碼。
通常情況下 onLoad 經常伴隨着 onShow，但 onShow的時候 onLoad不一定會觸發。
樣式部分：
與傳統的css 幾乎沒有差別，當然，單位上的使用還是有差異的 -----rpx（rpx的具體意思 請查閱官方文檔）
文件結構：
上圖有個home.json
微信小程序是可以修改小程序的標題欄樣式（例如背景色，字體色） 頁面名稱的，甚至包括是否允許下拉刷新行為
app.json
是對整個小程序全局的一些配置
{ //對於要使用的頁面必須注冊
"pages": [
"pages/home/home",
"pages/login/login"
],
"window": { //設置默認頁面的窗口表現
"backgroundTextStyle": "#FFF", //下拉背景字體、loading 圖的樣式
"navigationBarBackgroundColor": "#FFF", //背景
"navigationBarTitleText": "一拍即傳", //導航欄標題文字內容
"navigationBarTextStyle": "black", //導航欄標題顏色
"onReachBottomDistance": "500", //頁面上拉觸底事件觸發時距頁面底部距離，單位為px
"enablePullDownRefresh": false //設置下拉刷新
},
"networkTimeout": {
"request": 20000, //wx.request的超時時間，單位毫秒，默認為：60000
"connectSocket": 20000, //wx.connectSocket的超時時間，單位毫秒，默認為：60000
"uploadFile": 20000, //wx.uploadFile的超時時間，單位毫秒，默認為：60000
"downloadFile": 60000 //wx.downloadFile的超時時間，單位毫秒，默認為：60000
}
}
來達到圓圖的效果，在這種情況下，安卓手機上 首次進入頁面時，設置過border-radius的圖片，在加載時 是方的，渲染完成后是圓的，四個角會閃一下，這個過程大概在0.4s左右。
textarea組件是個好東西
