1. 程式人生 > >微信小程式(一)資料流與資料繫結

微信小程式(一)資料流與資料繫結

一、單向資料流和雙向資料流

1、單項資料流:指的是我們先把模板寫好,然後把模板和資料(資料可能來自後臺)整合到一起形成HTML程式碼,然後把這段HTML程式碼插入到文件流裡面

優點:資料跟蹤方便,流向單一,追尋問題比較方便【主要體現:微信小程式】。

缺點:就是寫起來不太方便,如果修改UI介面資料需要維護對應的model物件

2、雙向資料流值和UI是雙向繫結的,大家都知道,只要UI裡面的值發生變化model物件裡面對應的值也會發生變化,資料和UI是雙向繫結的。

優點;當修改UI頁面資料時候,對應的model物件值也會跟著改變。

缺點:雙向流動,追群問題相對負責【主要體現:Anguler.js和vue.js等】

》》》 開發前端的同學;尤其是WEB前端,每天都會和檢視打交道加入你用過原生的JS,還是JQUERY.JS等,都會感覺到程式碼的冗餘和負責,你需要手動去管理檢視和物件資料的一致性。

1、DOM物件是需要手動去維護,之所有比較麻煩。

》》》那麼問題來了,微信小程式是使用單向資料流還是雙向資料流呢?答案是為使用單向資料流【model模型------->檢視UI】,通過設定model物件的值進行渲染檢視UI
微信小程式案例,雖然案例很簡單,但是用於證明微信小程式使用的是單向資料流足夠了。 JS檔案
//index.js
//通過getApp獲取全域性應用程式物件
var app = getApp()
Page({


  data:{
    text:"單向資料庫",
    showText:"資料渲染",
  },


})

WXML檔案
<text>{{text}}</text>
<view >{{ showText }}</view>
頁面顯示結果
雙向資料流案例