注冊

微信小程序用什么框架,框架的核心是響應的數據綁定系統(tǒng)

2017-12-22
導讀:框架 小程序開發(fā)框架的目標是通過盡可能簡單、高效的方式讓開發(fā)者可以在微信中開發(fā)具有原生APP體驗的服務。 框架提供了自己的視圖層描述語言WXML和WXSS,以及基于JavaScript的邏輯層...

框架


小程序開發(fā)框架的目標是通過盡可能簡單、高效的方式讓開發(fā)者可以在微信中開發(fā)具有原生APP體驗的服務。

框架提供了自己的視圖層描述語言WXML和WXSS,以及基于JavaScript的邏輯層框架,并在視圖層與邏輯層間提供了數據傳輸和事件系統(tǒng),可以讓開發(fā)者可以方便的聚焦于數據與邏輯上。

 

響應的數據綁定


框架的核心是一個響應的數據綁定系統(tǒng)。

整個系統(tǒng)分為兩塊視圖層(View)和邏輯層(App Service)

框架可以讓數據與視圖非常簡單地保持同步。當做數據修改的時候,只需要在邏輯層修改數據,視圖層就會做相應的更新。

通過這個簡單的例子來看:

<!-- Thie is our View -->
<view> Hello {{name}}! </view>
<button bindtap="changeName"> Click me! </button>
// This is our App Service.
// This is our data.
var helloData = {
  name: 'WeChat'
}

// Register a Page.
Page({
  data: helloData,
  changeName: function(e) {
    // sent data change to view.
    this.setData({
      name: 'MINA'
    })
  }
})
  • 開發(fā)者通過框架將邏輯層數據中的name與視圖層的name進行了綁定,所以在頁面一打開的時候會顯示Hello WeChat!
  • 當點擊按鈕的時候,視圖層會發(fā)送changeName的事件給邏輯層,邏輯層找到對應的事件處理函數
  • 邏輯層執(zhí)行了setData的操作,將name從weChat變?yōu)?code>MINA,因為該數據和視圖層已經綁定了,從而視圖層會自動響應改變?yōu)?code>Hello MINA! 。

頁面管理


框架管理了整個小程序的頁面路由,可以做到頁面間的無縫切換,并給以頁面完整的生命周期。開發(fā)者需要做的只是將頁面的數據,方法,生命周期函數注冊進框架中,其他的一切復雜的操作都交由框架處理。

基礎組件


框架提供了一套基礎的組件,這些組件自帶微信風格的樣式以及特殊的邏輯,開發(fā)者可以通過組合基礎組件,創(chuàng)建出強大的微信小程序 。

豐富的API


框架提供豐富的微信原生API,可以方便的調起微信提供的能力,如獲取用戶信息,本地存儲,支付功能等。

 

更多微信小程序開發(fā)教程,可以關注hi小程序。
重磅推薦:小程序開店目錄

第一部分:小商店是什么

第二部分:如何開通一個小商店

第三部分:如何登錄小商店

第四部分:開店任務常見問題

第五部分:小商店可以賣什么

第六部分:HiShop小程序特色功能

第七部分:小程序直播

第八部分:小程序收貨/物流

第九部分:小程序怎么結算

第十部分:小程序客服

第十一部分:電商創(chuàng)業(yè)

第十二部分:小程序游戲開發(fā)