微信小程序剛出來，讓前端這個圈子又熱了起來，不少從業(yè)人員，也開始嘗鮮； 從官網(wǎng)上的wiki到微信開發(fā)工具的使用，有一些使用心得，再這里總結(jié)一下；
如果有那里說錯了，或有疑問，歡迎大家提出來，與大家一起學(xué)習(xí)成長。

官網(wǎng)上的wiki

小程序文檔

Paste_Image.png

微信的文檔還是很詳細(xì)的，只要是從業(yè)人員，看文檔便可看明白，實(shí)際操作也是簡單的很，上手快，微信這一點(diǎn)做的還是很不錯的，畢竟是大公司嘛

它總體用的框架是MVVM，現(xiàn)在前端大部分都已經(jīng)使用這類框架，如angular.js、vue.js、avalon.js 等，
開發(fā)標(biāo)準(zhǔn)也是web前端大同小異，如下

• WXML -> html
• WXSS -> css
• js -> js
• json -> json方式的配置文件

它的WXML就等同于html，只是標(biāo)簽沒有了，取而待之的是組件形式，大部分的功能組件已經(jīng)都有的，但是有些組件的api還是有些少的，目前也沒有第三方組件，（以后應(yīng)該會用的，畢竟這也是剛出來的）

語法就重要的三塊內(nèi)容就是框架、組件、api

Paste_Image.png

框架 -> 相關(guān)頁面的說明

json文件為配置說明，在根目錄有一個基本的app.json，里面配置整個項(xiàng)目的頁面，如pages，window，tabBar，networkTimeout等，也可以在某個頁面相關(guān)目錄下，建單頁面的配置

js文件為邏輯處理文件，與正常的js一樣，但是不能使用document、window等內(nèi)容，模塊化開發(fā)方式，各個js文件都是相互獨(dú)立的，可以通過require、include方式調(diào)用不同的模塊

WXML 文件為視圖層，數(shù)據(jù)綁定的方式也是Mustache語法（雙大括號），屬性綁定的前綴為wx:，和其它MVVM框架的屬性綁定方式大同小異

** WXSS 文件為樣式文件**，使用css語法，尺寸單位為rpx，規(guī)定屏幕寬為750rpx，iPhone6上，屏幕寬度為375px，共有750個物理像素，則750rpx = 375px = 750物理像素，

組件

WXML只能用組件的方式，每個組件都有自己的屬性，屬性是添加在WXML上的，相當(dāng)于src、href 這些內(nèi)容
組件分為：

• 視圖窗口 ->

  1. 視圖窗口（等同于DIV）
  2. 可滾動視圖區(qū)域（等同于一個滾動插件）

  3. 滑塊視圖容器。（等同于一個banner插件）

     
     
     Paste_Image.png

• 基礎(chǔ)內(nèi)容

  1. 圖標(biāo)（等同于圖標(biāo)庫）

     
     
     Paste_Image.png

  2. 文本（添加文字信息）

  3. 進(jìn)度條（一個進(jìn)度條的內(nèi)容）

Paste_Image.png

• 表單組件

  1. 按鈕（等同于 type=button）

     
     
     Paste_Image.png

  2. 多項(xiàng)選擇器（等同于type=checkbox）

  3. 表單（贊同于form）

  4. 輸入框 （等同于type=text）

  5. 標(biāo)簽（等同于label）

  6. 滾動選擇器（等同于select）

     
     
     Paste_Image.png

  7. 單項(xiàng)選擇器（等同于type=radio）

  8. 滑動選擇器（等同于type=range）

     
     
     Paste_Image.png

  9. 開關(guān)選擇器（等同于Bootstrap Switch）

• 操作反饋

  1. 從屏幕底部出現(xiàn)的菜單表

     
     
     Paste_Image.png

  2. 模態(tài)彈窗

     
     
     Paste_Image.png

  3. 消息提示框

     
     
     Paste_Image.png

  4. 加載提示

     
     
     Paste_Image.png

• 導(dǎo)航
  1、頁面鏈接（等同于a標(biāo)簽，但是只在連接內(nèi)部頁面，不能連接外部頁面）

• 媒體組件

  1. 音頻（等同于audio，可以連接外部音頻文件）

     
     
     Paste_Image.png

  2. 圖片（等同于img，可以連接外部視頻文件）

  3. 視頻（等同于video，可以連接外部視頻文件）

     
     
     Paste_Image.png

• 地圖

  1. 地圖（map）

• 畫布

  1. 畫布（等同于canvas）

API

Paste_Image.png

• native交互的接口
  • 設(shè)備
• 網(wǎng)絡(luò)請求的接口
  • 網(wǎng)絡(luò)
  • 位置
• 微信通信的接口
  • 界面
  • 開放接口

現(xiàn)在出來的是內(nèi)測版，功能上來說已經(jīng)添加了大部分常用功能，但是還有一些不足，希望以后微信可以更好的完善。

有些人說，微信可能會取代app，我覺的，這是不可能的。
第一、當(dāng)時的pc游戲現(xiàn)在已經(jīng)可以在網(wǎng)頁中玩了，但是現(xiàn)在的pc游戲變的更加好，再過十年現(xiàn)在的pc游戲可能會出現(xiàn)在網(wǎng)頁中，但是那到時，會出現(xiàn)更好的pc游戲，這和app是一樣的，微信限制了很多東西，現(xiàn)在要按它的ui來設(shè)計(jì)界面，等到它的能力到達(dá)現(xiàn)在的app這樣，到那時，app可能會做出更好的東西，未來我們是很難想像的。
第二，微信畢竟是騰訊的，別的公司不可能把自己的命運(yùn)都放在騰訊手里，他們可能會開發(fā)微信應(yīng)用，但不會把微信應(yīng)用做為一個主要的流量入口，
他們可能會將微信做一個導(dǎo)入自己產(chǎn)品的一個入口。
以上觀點(diǎn)為個人觀點(diǎn)，不喜誤噴！