微信小程序：開發以前要知道的三件事

微信之父張小龍在年初的那次演講中曾表示：「我本身是不少年的程序員，我以爲咱們應該爲開發的團隊作一些事情」。幾個月後，微信正式推出微信應用號（即微信小程序），在互聯網中掀起了又一波熱潮。  因而，不少人準備要開發微信的小程序，若是你真的想要開發小程序，就要先學會一套微信特製的「開發語言」。爲了更好地上手這門開發語言，下面這三件事你必定要知道： 語言與文件 微信小程序來發與其餘平臺開發的最大差別在於：微信使用的開發語言和文件很「個性」。  小程序所使用的程序文件類型大體分爲如下幾種： ·        WXML（WeiXin Mark Language， 微信標記語言） ·        WXSS（WeiXin Style Sheet，微信樣式表） ·        JS（JavaScript， 小遊戲的主體） 在語言方面，下程序看似從新定義了一套標準。但實際上，他們與「前端三件套」（HTML、CSS和JavaScript）差不太多。來來來，看一下微信小程序開發語言和「前端三件套」的異同點。  界面搭建 一、基本邏輯 WXML和WXSS兩種文件是小程序界面元素聲明及樣式描述文件。 WXML最大的特色是以視圖（View）的方式串聯界面元素，並經過程序邏輯（AppService）將信息更新實時傳遞至視圖層。 View相似於HTML中的div元素，在構建的時候，View能夠被多級嵌套，View內能夠放置任意視覺元素。 須要注意的是，元素一旦超出屏幕以外，用戶就沒法看到了，這是與HTML喲較大的不一樣。小程序喲專門用於滾動的視圖。若是但願界面是一個能夠自由滾動的界面（例如列表等），可使用scroll-view視圖，在WXSS中將其大小調整爲整個屏幕，並設置scroll-y（上下滾動）或scroll-x（左右滾動）爲true， 注意，小程序中不能直接使用DOM控制WXML元素。若是須要進行數據更新，就要使用WXML提供的數據綁定及元素渲染方法，還有一點，小程序的柵格排版系統使用的是Flex佈局，它是W3C在2009年提出的一種排版標準。 二、綁定數據 對於單個字段，開發者可使用數據綁定的方法進行信息更新。綁定的數據除了在加載的時候能夠更新，也能夠在JS主程序中以函數形式進行更新，更新一樣能夠反應到界面上被綁定的數據中。 三、條件渲染與列表（循環）渲染 條件渲染適用於有意外狀況提示的頁面（如沒法加載列表或詳情時，作出提示等等）。它的渲染帶有觸發條件，即符合條件時渲染這個頁面，不然忽略或渲染另外一端代碼。兩個花括號所包含的判斷條件中的變量於主程序JS代碼中的data中聲明。將同一元素渲染代碼進行集合。循環的數據能夠經過數組的方式寫入data中供WXML訪問。渲染完畢後，渲染判斷條件的變更能夠影響界面變更。 四、模板與引用 WXML支持使用模板與引用減小代碼體積。模板是在WXML代碼中對相同的代碼進行復用的方式。能夠將多個模板寫入至同一個文件，並使用import在其餘文件中進行引用。若是須要整個頁面引用，須要使用include。 五、樣式 經過WXSS樣式表，開發者能夠定義WXML中的元素樣式。WXSS與CSS代碼同樣，能夠直接使用選擇器選擇元素，在WXML中也能夠直接定義元素的id和class以便於在WXSS文件中進行樣式定義。 六、用戶操做與事件響應 因爲微信使用的不是HTML，因此也不能經過添加超連接（a元素）的方式來檢測用戶的點擊事件。對於須要監聽點擊事件的元素，應該在WXML中使用bindtap屬性或catchtap屬性進行綁定。除了點擊一次，微信也提供按住、開始觸摸、鬆手等事件響應。在WXML中綁定好一個事件以後，就能在主程序中使用。其餘的API中也有相應的事件，這些事件樂意在微信小程序的官方文檔中查閱到。當須要在小程序的頁面間進行跳轉時，應該使用wx.navigateTo()方式。  注意，有關於頁面層級跳轉，微信將層級跳轉限制在5層。在開發時必定注意不要超過了相應限制。 網絡請求方式 網絡訪問小程序支持三種請求方式：HTTP鏈接、WebSocket、文件收發鏈接。 ·        HTTP鏈接：請求後直接返回結果，鏈接結束； ·        Socket鏈接：持續性鏈接，當一方主動關閉鏈接時，鏈接結束； ·        文件收發鏈接：顧名思義，發生在文件傳輸時的鏈接。（錄製的語音和選擇的照片都須要這個鏈接完成）。 注意，經過小程序訪問網絡須要服務器必須支持HTTPS鏈接，且端口必須爲443。同時，小程序只能訪問開發者在登記小程序時設定的服務器地址。 開發語言和「前端三件套」的異同點 ·        HTML與WXML：二者差別比較大，若是以前沒有接觸過Android開發，可能會以爲有些頭疼。事實上，WXML更像是Android開發中的界面XML描述文件，適合於程序界面的構建；而HTML則傾向於文章的展現（這與HTML的歷史有關），以及互聯網頁面的構建。 ·        WXSS與CSS：二者在語言上幾乎沒有差異，能夠直接通用。 ·        JS文件：小程序的JS文件與前端開發使用的JS幾乎沒有區別，只是小程序的JS新增了微信的一些API接口，並去除了一些沒必要要的功能（如DOM）。 在有眼上，小程序徹底向學習成本最低的前端開發看齊，但這不表明全部開發者都能無縫遷移。若是你是從前端開發轉向小程序，就要注意這兩點： ·        1、HTML與WXML兩種文件的構建思想差別較大，若是以前只接觸過前端開發，須要一點時間才能適應WXML的編寫方法。 ·        2、雖然小程序使用的是前端語言，但不表明能夠繼續沿用的開發思想進行開發。小程序對前端開發的要求從【構建界面】升級成【開發完整應用】，前端開發須要在乎識上進行轉變。 更多精彩內容，加羣434623999