2011-07-27 30 views
6

我目前正在KnockoutJS上構建一個網絡應用程序 - 真的,使用編程幸福!Sencha Touch可以像KnockoutJS一樣使用MVVM模式嗎?

我已經到了一個階段,我需要添加一個移動開發框架,並一直在考慮我的選擇。

我目前傾向於使用Sencha Touch,因爲它的成熟度和獨特的插件是我需要的。

我唯一擔心的是Sencha Touch的OO +聲明式JavaScript編碼是否適合MVVM框架,比如Knockout?

我的意思是Knockout利用了View(HTML頁面)將通過數據綁定來調用模型的概念。 ExtJS(Sencha Touch)不會豐富View ...,而是期望所有HTML內容都以聲明方式編寫。

我在這裏處理油和水嗎?你有什麼想法。

注:我很想知道這兩種不同的體系結構是否能夠很好地結合在一起。對Sencha Touch如何與其他框架進行比較不太感興趣。

回答

4

這是石油和...不同種類的石油。 Sencha Touch擁有自己的MVC'ish體系結構,包含數據綁定和模板,以及大量其他內容,例如移動窗口,事件處理,主題化,圖表製作等。我會預測您將遇到嚴重困難混合兩者。但是,如果你設法做到這一點,我們很樂意聽到它(我是一個煎茶人)

更新:正如託尼提到的 - 谷氨醯胺爲Sencha已經出來,因爲我回答了這個問題 - http://www.conarrative.com/glujs.html 。如果你想要MVVM風格與MVC(我們喜歡他們的方法),它幾乎就是你正在尋找的東西。

3

這絕對是可能的,我確實使用了我的最後一個項目。然而,你需要放棄淘汰賽最有趣的部分:DOM元素綁定和大部分商店的能力。相反,您需要監聽視圖模型更改並相應地更新ExtJS視圖。並不是所有的ExtJS組件都是可視化綁定的,例如,可以採用滑塊。因爲我是一個Flex人(你可以在Flex中綁定任何東西,說實話,其他所有東西在使用綁定之後就會吮吸(甚至是sencha)),但我感覺有些問題,並且對我的模型使用了knockout。我們正在討論var var update更新var c,因此這裏的淘汰賽非常完美。很多事情必須手工完成,比如模型視圖綁定,最後我不能說我爲結果感到自豪,因爲它不是最有組織的代碼(實際上看起來非常醜陋),我不會推薦它除非你的模型之間有很多依賴關係。

+0

如果我理解正確,您只使用SechaTouch的視圖。模型完全來自Knockout。另外Sencha Views受數據綁定目的的Knockout視圖支持。 您需要使用Sencha View圖層的任何具體原因? –

5

GluJS爲ExtJS 3.x和4.x提供了MVVM。 Sencha Touch綁定正在管道中。這些人還提供了一個整潔的規範(SVVM)方法。這些東西應該是Sencha核心代碼庫的一部分,而ExtJS 4.x類模型將是一個完美的選擇,因爲4.x可以爲GluJS使用的雙向綁定提供鉤子。

DeftJS:另一個很好的選擇,已得到很好的支持是DeftJS;一個開源的lib,向Sencha ExtJS和Touch添加MVC和ViewControllers(所以不是完整的MVVM)。它還增加了控制反轉(IoC)和Promises/Deferreds以實現更簡潔的異步編碼。

更新中...

Sencha ExtJS 5.x現在支持View Model的完整MVVM,我們預計下一個主要版本... Sencha Touch 3.x ...可能也會這樣做。 ExtJS 5.x也進行了更新,使其包含與Sencha Touch相同的核心類和類模型,因此這使得Touch 3.x更有可能與ExtJS 5.x匹配相同的View Model。

KnockoutJS做它做得很好,但它只是你需要的一部分。不利的一面是,你最終不得不去尋找所有缺失的部分,然後播放「版本我,如果你可以」穿過你的手指,明年所有的位仍然由「某人」支持。相比之下,Sencha API提供了在一個版本週期內構建和維護整個應用程序所需的大部分內容。查看this blog post下的標題「The Modern Web Stack」。

+0

我想我會開始使用這個,任何_「入門」_建議? – blong

0

我寫了一篇博客文章,概述了one approach to a MVVM pattern in Sencha Touch,它使用Sencha Touch的內置MVC技術,而未在其他框架上進行回覆。

基本上這個想法是圍繞Sencha Touch非常「基於商店」的事實展開的:當記錄被更改時,事件在記錄的商店中觸發,而不是在記錄本身上觸發。因此,如果我們將模型視圖的xtypes與商店相關聯,那麼我們可以遍歷這些視圖並在記錄更改時根據需要對其進行更新。

總的來說,這個解決方案只有幾十行。如果你不想學習像GluJS這樣的另一個框架,這是一個很好的輕量級選擇。

相關問題