在 HTML5 中使用 MVVM 编码模式的合理方法是什么答案

【问题标题】：What is a reasonable way to use MVVM coding patterns with HTML5在 HTML5 中使用 MVVM 编码模式的合理方法是什么
【发布时间】：2011-12-11 02:08:47
【问题描述】：

我有一个用 Silverlight 编写的不错的应用程序。为了提供更好的跨浏览器支持，我们正在考虑使用 HTML5 前端进行重写。

什么是从 Silverlight 使用 XAML 和 C# 以及 MVVM 编码模式转移到 HTML5 前端的合理方法。

另一方面，如果这不是一个好主意并且应该放弃 MVVM 模式，请解释原因。

【问题讨论】：

我也很想知道 HTML/Javascript 的“Caliburn.Micro”等效框架。我对淘汰赛一无所知，但这似乎主要处理绑定的肮脏工作。加载视图、导航、子视图等怎么样？据我所知，extjs 似乎是唯一试图解决这个问题的框架。

标签： silverlight html mvvm cross-browser

【解决方案1】：

Knockout 是用 HTML/Javascript 实现的 MVVM 模式，具有数据绑定等功能。 http://knockoutjs.com/

如果你想要的只是通过 DOM 操作就可以实现，并且你已经习惯并喜欢 MVVM 模式，那么 Knockout 应该是一个不错的选择。

【讨论】：

【解决方案2】：

Knockout 是一个很棒的 JavaScript 库，可以帮助您编写 MVVM 客户端。您在 javascript 中创建视图模型并使用 html 模板（在 jquery 模板的帮助下）绑定到它们。您的视图模型可以使用 ajax 来检索数据。

它本质上与 Silverlight 开发相同——您使用 HTML 代替 XAML，使用 javascript 代替 C#/VB.Net。您甚至可以真正使用相同的 Web 服务...如果您打算稍后同时提供接口或转换，这可能会有所帮助。

编辑
认为我会补充一点，恕我直言 MVVM 不应该被放弃，因为它确实在分离关注点方面做得很好（我猜如果实施正确），但一个巨大的胜利肯定是它让开发人员考虑或在心态或分离责任在一个应用程序中。我将 Knockout.js 用于 Web 项目，将 Caliburn.Micro 用于 Silverlight，并且非常喜欢这种开发风格。

【讨论】：

【解决方案3】：

是的，HTML 5 的 MVVM 模式称为 MVC。使用 MVC3 最容易实现。提供关于 JavaScript 代码的抽象层，支持 ViewModel（又名视图）以及视图、数据访问和业务逻辑之间的关注点分离。

最重要的是，验证和 UI 事件处理以一种简单的方式为您连接起来，使您可以从各种 HTML 控件的 JavaScript 事件处理程序的复杂性中抽象出来。

但是，如果您严格地想坚持使用 HTML 和 JavaScript，我建议您使用自己的 JavaScript 类（是的，JS 是函数式语言，但您仍然可以制作那些）来代表您的 UI 层并处理 UI 事件。然后创建您自己的 Ajax 库，用于从 UI 类到服务器后端来回获取 JSON 序列化数据。最后创建您自己的业务逻辑类（也在 javascript 中）来控制您的 UI 和 DataAccess (ajax) 类。总之......很多肮脏的工作。

【讨论】：

【解决方案4】：

还有来自 Google 的实验性模型驱动视图 (MDV) 库。不幸的是，它仅用作原型展示。从概念上讲，它真的很酷，但请准备好自己修复一些错误。

http://code.google.com/p/mdv/

【讨论】：

【解决方案5】：

还有 JSViews。这个不像 Knockout 那样流畅，但它在更新 DOM 方面更快。该项目与 jquery 关系松散，因为它的作者是现已废弃的查询模板的幕后推手。

【讨论】：