1. 程式人生 > >小程序開發初涉實踐與要點

小程序開發初涉實踐與要點

存在 默認 結構 小程序 nts 前端 1.0 div col

寫此文章的時候,使用微信開發者工具版本為v1.02,調試基礎庫使用2.3.0

因為相關實現方法與vue有點類似,此文章記錄一些關鍵點與實現、與vue的區別,以免搞混


語法區別

  • 綁定屬性到標簽或組件,要用雙{{}}號,不用像vue前端加:
  • 所以屬性內有拼接其它字符串,直接寫在屬性內,不用使用+號 如 :<view id="item-{{id}}"> </view>
  • 列表渲染默認不用寫item與index,可以直接使用,當然也可以指定另外的名字

關於引用ui組件庫

幾個ui組件庫,如vant-weapp,iView weapp,都已編譯好在dist目錄,直接全部復制到小程序目錄下即可使用

可以同時使用多個ui庫

註:最好不要只復制需要的組件文件夾,vant的組件都有引用其它目錄,如common,mixins

每個組件為一個目錄,以四種文件存在:js,JSON,WXML,WXSS四種文件

引用方式:

在頁面對應的json文件,usingComponents中引入,如

"van-tabs": "../../vant/tabs/index"

頁面中直接以引用的鍵名為標簽名來插入如 :<van-tabs></van-tabs>

關於WXS模塊(?)

小程序官方的話:WXS(WeiXin Script)是小程序的一套腳本語言,結合 WXML,可以構建出頁面的結構。

小程序開發初涉實踐與要點