【移动应用开发技术】Backbone.js Wine Cellar中CRUD的示例分析

【移动应用开发技术】Backbone.jsWineCellar中CRUD的示例分析

在下给大家分享一下Backbone.jsWineCellar中CRUD的示例分析，希望大家阅读完这篇文章之后都有所收获，下面让我们一起去探讨吧！您将学习创建、更新及删除(CRUD)葡萄酒。HTTP方法URL操作GET/api/wines检索所有葡萄酒GET/api/wines/10检索id==10的葡萄酒POST/api/wines添加新葡萄酒PUT/api/wines/10更新id==10的葡萄酒DELETE/api/wines/10删除id==10的葡萄酒这些服务的PHP版本（使用Slim框架）均将随下载内容一同提供。

本文还将提供一个类似的Java版本的API（使用JAX-RS）。搭配使用Backbone.js和非RESTful服务如果您的持久层无法通过RESTful服务进行提供，您可以替换Backbone.sync。在本文档中：“Backbone.sync是一个函数，Backbone每次尝试读取模型或将其保存至服务器时都会调用该函数。默认情况下，它使用(jQuery/Zepto).ajax发出RESTfulJSON请求。您可以替换它，以便利用不同的持久性策略，比如WebSockets、XML传输或本地存储。”我不会在本教程中讨论非RESTful服务的使用。有关更多信息，请参阅文档

。添加创建、更新和删除功能您可以

运行将在本教程中进行编码的应用程序。此在线版本的创建、更新和删除功能均已禁用。此在线版本的创建、更新和删除功能均已禁用。图2.backbone.js代码代码重点Wine（第2行至第14行）第二部分向该葡萄酒模型添加了两个属性，如下所示：(1)urlRoot

（第3行）：RESTful服务终端将检索或保存模型数据。请注意，只有在检索/保存独立于集合的模型时才需要使用此属性。如果该模型是集合的一部分，集合中定义的URL属性足以供Backbone.js了解如何使用您的RESTfulAPI检索、更新或删除数据。(2)Defaults

（第4行）：为模型创建新实例时使用的默认值。此属性是可选属性。但是，此应用程序需要使用此属性促使wine-details信息模板呈现“空”葡萄酒模型对象（该情况将在添加新葡萄酒时发生）。WineListView（第22行至第40行）当用户添加新葡萄酒时，您希望它自动显示在列表中。要做到这一点，请将视图绑定至WineListView模型（葡萄酒集合）的添加事件。当事件触发后，该应用程序会创建新的WineListItemView实例并将其添加到该列表中。WineListItemView（第42行至第62行）(1)当用户改变葡萄酒时，您希望对应的WineListItemView自动重新呈现以反映这种变化。要做到这一点，请将视图绑定至其模型的更改事件，然后在触发事件时执行Render函数。同样，当用户删除葡萄酒时，您希望自动删除列表项。(2)要做到这一点，请将视图绑定至其模型的破坏事件，然后在触发事件时执行我们的自定义Close函数。重要注意事项：

为避免内存泄露及事件多次触发，重要的是先解除事件侦听器绑定，然后再从DOM中删除列表项。(3)请注意，无论发生哪种情况，您都不用承担重新呈现整个列表的费用。您只能重新呈现或删除受更改影响的列表项。WineView（第64行至第123行）本着封装精神，Save和Delete按钮的事件处理程序均在WineView内部进行定义，这与将它们作为自由悬挂式代码块在“类”定义外部定义截然相反。使用Backbone.js事件语法，采用jQuery幕后委托机制。您始终可以根据用户在表单中的输入内容采用以下不同方法来更新模型：(1)“实时”方法：使用更改处理程序在表单更改时更新模型。这种方法从本质上而言是双向数据绑定方法。模型和UI控件始终同步。您可以利用这种方法选择将更改实时发送至服务器（隐式保存），还是等到用户单击Save按钮时再发送更改（显示保存）。***个选项在存在交叉字段验证规则时不正式也不可行。而第二个选项可能需要您撤销模型更改，如果用户在未单击Save的情况下导航至其他项目的话。(2)“延迟”方法：等到用户单击Save时再根据UI控件的新值更新模型，然后将这些更改发送至服务器。本讨论主题并非Backbone.js特有，因此本文并未就此进行探讨。为简单起见，我在此处使用延迟方法。但是，我依然导入更改事件，并利用其记录控制台更改。我发现此方法在调试应用程序（特别是要确保我已经清除绑定，请参见Close函数）时非常有效。如果您发现更改事件触发多次，则可能没有相应地清除绑定。HeaderView（第125行至第148行）Backbone.js视图通常用于呈现域模型（比如W