成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

BlockLang 頁面（設(shè)計草稿）

SwordFly / 2831人閱讀

摘要：我們將用戶可以看到的可以交互的前端稱為頁面。只有外觀和數(shù)據(jù)的頁面，只能稱為靜態(tài)頁面，顯然我們?nèi)粘Ｊ褂玫母嗍莿討B(tài)頁面，這就需要在靜態(tài)頁面上加上變的因素，我們也稱之為行為。在介紹靜態(tài)頁面往動態(tài)頁面的轉(zhuǎn)換時，需要先介紹一個重要概念驅(qū)動。

頁面

一個完整的程序模塊由一個前端頁面和多個后端服務(wù)組成，然后使用后端服務(wù)的 URL 將前端和后端關(guān)聯(lián)起來。我們將用戶可以看到的、可以交互的前端稱為頁面。

隨著 web 技術(shù)的發(fā)展，我們理解或看待“頁面”的角度一直在變化，朝著更規(guī)范、更簡單的方向變。我們借助時下流行的 MVVM(Model-View-ViewModel) 框架重新審視界面，歸納出頁面三要素，但舊瓶裝新酒，邊界更清晰，內(nèi)涵更豐富。

頁面的三個組成要素：

外觀(ui)

數(shù)據(jù)(data)

行為(behavior)

外觀

一個網(wǎng)頁的外觀是由 HTML 和 CSS 實現(xiàn)的，但 HTML 和 CSS 都是實現(xiàn)細節(jié)，如果直接依賴實現(xiàn)細節(jié)，我們就沒有辦法用相同的概念描述 Android 頁面或 iOS 頁面，所以我們將外觀的組成抽象為：

結(jié)構(gòu) - 使用 UI 組件逐層嵌套形成樹狀結(jié)構(gòu)，且只有一個根節(jié)點，并稱之為 Page

樣式 - 使用主題的概念統(tǒng)一設(shè)置和更換樣式，如 Dojo Theme 技術(shù)

注意：為了讓概念更加簡單和純粹，我們認為結(jié)構(gòu)只能由 UI 組件一個元素組成。

數(shù)據(jù)

一個應(yīng)用程序中的數(shù)據(jù)可根據(jù)使用范圍劃分層級：

全局數(shù)據(jù) - 全局共享的數(shù)據(jù)，所有頁面都可以使用

頁面數(shù)據(jù) - 只有所在的頁面才可以使用

頁面數(shù)據(jù)本可以再進一步細分，如按區(qū)塊等，但如果我們使用 React Redux 或 Dojo Store 等技術(shù)將頁面中的數(shù)據(jù)集中存儲后，就無需進一步拆分。

頁面中的數(shù)據(jù)，分為兩大類：

業(yè)務(wù)數(shù)據(jù)

交互數(shù)據(jù) - 如數(shù)據(jù)有效性校驗結(jié)果和提示信息等

頁面中的數(shù)據(jù)會獨立、集中存儲，但又能注入到頁面的結(jié)構(gòu)中。

行為

一提到頁面中的行為或交互，我們就想到了 JavaScript。但 JavaScript 依然是實現(xiàn)細節(jié)，我們將 JavaScript 做的所有事情抽象為一個概念，并稱之為“行為”。

只有外觀和數(shù)據(jù)的頁面，只能稱為靜態(tài)頁面，顯然我們?nèi)粘Ｊ褂玫母嗍莿討B(tài)頁面，這就需要在靜態(tài)頁面上加上變的因素，我們也稱之為“行為”。

在介紹靜態(tài)頁面往動態(tài)頁面的轉(zhuǎn)換時，需要先介紹一個重要概念：驅(qū)動。頁面不會無緣無故的變，它必然是由其他因素驅(qū)動著變的。

目前總結(jié)出兩種驅(qū)動頁面變化的原因：

數(shù)據(jù)變更驅(qū)動（內(nèi)因）

用戶交互驅(qū)動（外因）

在介紹外觀和數(shù)據(jù)時，我們不僅說明了如何拔高抽象，也說明了如何落地實現(xiàn)。同樣，行為也需要落地實現(xiàn)，我們使用純函數(shù)來描述一個行為。

純函數(shù)：返回結(jié)果只依賴于它的參數(shù)，并且在執(zhí)行過程里面沒有副作用，是冪等的，無狀態(tài)的。

Block Lang 官網(wǎng) https://blocklang.com

Block Lang 源碼 https://github.com/blocklang/ 或 https://gitee.com/blocklang/

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/106864.html

相關(guān)文章

  • BlockLang 0.2.0 發(fā)布啦

    摘要：官網(wǎng)歡迎您了解發(fā)布的功能。中使用提交功能管理頁面等項目資源的變更。 BlockLang 官網(wǎng)：https://blocklang.com 歡迎您了解 Block Lang 0.2.0 發(fā)布的功能。此版本增加三個功能： 在項目中創(chuàng)建空頁面 在項目中創(chuàng)建分組 使用版本控制系統(tǒng)管理新創(chuàng)建的頁面 創(chuàng)建空頁面 頁面，等同 web 項目中的網(wǎng)頁，或小程序中的頁面，其中包含頁面布局、頁面樣式和...

    alphahans 評論0 收藏0

  • BlockLang - 軟件拼裝工廠

    摘要：相信每個人都可按照自己的需求，拼裝出稱心的軟件。告別傳統(tǒng)的業(yè)務(wù)系統(tǒng)開發(fā)模式，人人都能高效率的拼裝出高質(zhì)量的業(yè)務(wù)系統(tǒng)。 轉(zhuǎn)眼間，做業(yè)務(wù)系統(tǒng)的軟件開發(fā)已有十個年頭，從剛開始的激情滿滿，到周而復(fù)始地一個接一個的做項目，雖然竭盡全力將一些常用的代碼或模式封裝到框架中，但依然感覺到了無盡的重復(fù)，而正是這無盡的重復(fù)在逐漸的吞噬著我的工作熱情。 我意識到，雖然我熱愛軟件研發(fā)，但目前的業(yè)務(wù)系統(tǒng)軟件研發(fā)...

    Charles 評論0 收藏0

  • 100行代碼，輕松搞定文本編輯器中草稿箱

    摘要：本文節(jié)選自設(shè)計模式就該這樣學(xué)使用備忘錄模式實現(xiàn)草稿箱功能大家都用過網(wǎng)頁中的富文本編輯器，編輯器通常都會附帶草稿箱撤銷等操作。首先創(chuàng)建發(fā)起人角色編輯器類。 本文節(jié)選自《設(shè)計模式就該這樣學(xué)》1　使用備忘錄模式實現(xiàn)草稿箱功能大家都用過網(wǎng)頁中的富文本編輯器，編輯器通常都會附帶草稿箱、撤銷等操作。下面用一段代碼來實現(xiàn)一個...

    番茄西紅柿 評論0 收藏2637

  • songEagle開發(fā)系列：如何科學(xué)有效的讓博客文章實時保存

    摘要：一寫在前面如何實現(xiàn)文章的實時保存一般寫文章的寫博客的網(wǎng)站都會有這個功能點，這樣保證了用戶在不小心退出的情況下數(shù)據(jù)的保存下來，這樣的交互比較符合用戶的使用心理學(xué)。 一、寫在前面 如何實現(xiàn)文章的實時保存？一般寫文章的寫博客的網(wǎng)站都會有這個功能點，這樣保證了用戶在不小心退出的情況下數(shù)據(jù)的保存下來，這樣的交互比較符合用戶的使用心理學(xué)。對于用戶來說這是一個非常實用的功能，作為一個博客來說，有這個...

    hatlonely 評論0 收藏0

  • Nicon-支持私有部署的開源字體圖標(biāo)管理平臺！

    摘要：靜態(tài)資源的訪問通過配置代理實現(xiàn)頁面的訪問，跟服務(wù)端工程毫無關(guān)系，服務(wù)端只負責(zé)提供異步接口。集中管理異步接口配置的模塊 Nicon 一言不合，先上平臺Nicon。該平臺接入github登錄，采用七牛CDN存儲，歡迎大家試用。 Nicon 是一個集圖標(biāo)上傳、展示、使用于一身的字體圖標(biāo)管理平臺，流程簡單，符合日常開發(fā)使用習(xí)慣，適合企業(yè)在內(nèi)部部署使用。采用 Iconfont 字體圖標(biāo)替換項目中...

    trigkit4 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<