微信小程式開發教程（五）開發框架 MINA

框架的核心是乙個響應的資料繫結系統，它讓資料與檢視非常簡單地保持同步。當做資料修改的時候，只需要在邏輯層修改資料，檢視層就會做相應的更新。我們看下面這個例子：

<

view
> hello }
view
>
<
button 
bindtap
="changename"
>click me
button
>

//

demo.js
var hellodata =
page()
}})

♦ 當點選按鈕的時候，檢視層會傳送changename的事件給邏輯層，邏輯層找到對應的事件處理函式。

♦ 邏輯層執行了setdata的操作，將name從wechat 變為 mina，因為該資料和試圖層已經繫結了，從而檢視層會自動改變為hello mina。

邏輯層

♦ 每個頁面有獨立的作用域，並提供模組化能力。

邏輯層的實現就是編寫各個頁面的.js指令碼檔案。但由於小程式並非執行在瀏覽器中，所以j**ascript在web中的一些能力無法使用，如document、window等。

我們開發編寫的所有**最終會打包成乙份j**ascript，並在小程式啟動的時候執行，直到小程式銷毀。

檢視層

♦ .wxml檔案用於描述頁面的結構。

♦ .wxss檔案用於描述頁面的樣式。

檢視層以給定的樣式展現資料並反饋時間給邏輯層，而資料展現是以元件來進行的。元件是檢視的基本組成單元。

資料層

資料層包括臨時資料或快取、檔案儲存、網路儲存與呼叫。

1.頁面臨時資料或快取

在page()中，我們要使用setdata函式將資料從邏輯層傳送到檢視層，同時改變對應的this.data的值。

注意：

直接修改this.data無效，無法改變頁面的狀態，還會造成資料不一致。
單次設定的資料不能超過1024kb，請盡量避免一次設定過多的資料。

2.檔案儲存（本地儲存）

使用資料api介面，如下所示：

♦ wx.getstorage:獲取本地資料快取。

♦ wx.setstorage:設定本地資料快取。

♦ wx.clearstorage:清理本地資料快取。

3.網路儲存或呼叫

♦ wx.request:發起網路請求。

♦ wx.uploadfile:上傳檔案。

呼叫url的api介面，如下：

♦ wx.n**igateto:新視窗開啟頁面。

♦ wx.redirectto:原視窗開啟頁面。

微信小程式開發框架整理

github 官方文件 特性 類vue開發風格 支援自定義元件開發 支援引入npm包 支援promise 支援es2015 特性，如async functions 支援多種編譯器，less sass stylus postcss babel typescript pug 支援多種外掛程式處理，檔案壓...

微信小程式專案開發教程

1.目錄結構 test page index index.js index.json index.wxml index.wxss onlaunch function onshow function onhide function globaldata debug true page containe...

微信小程式開發

一 開發準備 二 開發工具的使用 編碼目錄結構 1 wxml的功能 資料繫結 資料繫結使用 mustache 語法 雙大括號 將變數包起來。列表渲染 wx for 在元件上使用 wx for 控制屬性繫結乙個陣列，即可使用陣列中各項的資料重複渲染該元件。block wx for 類似 block w...