【移動(dòng)應(yīng)用開發(fā)技術(shù)】Backbone.js Wine Cellar中CRUD的示例分析

【移動(dòng)應(yīng)用開發(fā)技術(shù)】Backbone.jsWineCellar中CRUD的示例分析

在下給大家分享一下Backbone.jsWineCellar中CRUD的示例分析，希望大家閱讀完這篇文章之后都有所收獲，下面讓我們一起去探討吧！您將學(xué)習(xí)創(chuàng)建、更新及刪除(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的葡萄酒這些服務(wù)的PHP版本（使用Slim框架）均將隨下載內(nèi)容一同提供。

本文還將提供一個(gè)類似的Java版本的API（使用JAX-RS）。搭配使用Backbone.js和非RESTful服務(wù)如果您的持久層無法通過RESTful服務(wù)進(jìn)行提供，您可以替換Backbone.sync。在本文檔中：“Backbone.sync是一個(gè)函數(shù)，Backbone每次嘗試讀取模型或?qū)⑵浔４嬷练?wù)器時(shí)都會(huì)調(diào)用該函數(shù)。默認(rèn)情況下，它使用(jQuery/Zepto).ajax發(fā)出RESTfulJSON請(qǐng)求。您可以替換它，以便利用不同的持久性策略，比如WebSockets、XML傳輸或本地存儲(chǔ)?！蔽也粫?huì)在本教程中討論非RESTful服務(wù)的使用。有關(guān)更多信息，請(qǐng)參閱文檔

。添加創(chuàng)建、更新和刪除功能您可以

運(yùn)行將在本教程中進(jìn)行編碼的應(yīng)用程序。此在線版本的創(chuàng)建、更新和刪除功能均已禁用。此在線版本的創(chuàng)建、更新和刪除功能均已禁用。圖2.backbone.js代碼代碼重點(diǎn)Wine（第2行至第14行）第二部分向該葡萄酒模型添加了兩個(gè)屬性，如下所示：(1)urlRoot

（第3行）：RESTful服務(wù)終端將檢索或保存模型數(shù)據(jù)。請(qǐng)注意，只有在檢索/保存獨(dú)立于集合的模型時(shí)才需要使用此屬性。如果該模型是集合的一部分，集合中定義的URL屬性足以供Backbone.js了解如何使用您的RESTfulAPI檢索、更新或刪除數(shù)據(jù)。(2)Defaults

（第4行）：為模型創(chuàng)建新實(shí)例時(shí)使用的默認(rèn)值。此屬性是可選屬性。但是，此應(yīng)用程序需要使用此屬性促使wine-details信息模板呈現(xiàn)“空”葡萄酒模型對(duì)象（該情況將在添加新葡萄酒時(shí)發(fā)生）。WineListView（第22行至第40行）當(dāng)用戶添加新葡萄酒時(shí)，您希望它自動(dòng)顯示在列表中。要做到這一點(diǎn)，請(qǐng)將視圖綁定至WineListView模型（葡萄酒集合）的添加事件。當(dāng)事件觸發(fā)后，該應(yīng)用程序會(huì)創(chuàng)建新的WineListItemView實(shí)例并將其添加到該列表中。WineListItemView（第42行至第62行）(1)當(dāng)用戶改變葡萄酒時(shí)，您希望對(duì)應(yīng)的WineListItemView自動(dòng)重新呈現(xiàn)以反映這種變化。要做到這一點(diǎn)，請(qǐng)將視圖綁定至其模型的更改事件，然后在觸發(fā)事件時(shí)執(zhí)行Render函數(shù)。同樣，當(dāng)用戶刪除葡萄酒時(shí)，您希望自動(dòng)刪除列表項(xiàng)。(2)要做到這一點(diǎn)，請(qǐng)將視圖綁定至其模型的破壞事件，然后在觸發(fā)事件時(shí)執(zhí)行我們的自定義Close函數(shù)。重要注意事項(xiàng)：

為避免內(nèi)存泄露及事件多次觸發(fā)，重要的是先解除事件偵聽器綁定，然后再?gòu)腄OM中刪除列表項(xiàng)。(3)請(qǐng)注意，無論發(fā)生哪種情況，您都不用承擔(dān)重新呈現(xiàn)整個(gè)列表的費(fèi)用。您只能重新呈現(xiàn)或刪除受更改影響的列表項(xiàng)。WineView（第64行至第123行）本著封裝精神，Save和Delete按鈕的事件處理程序均在WineView內(nèi)部進(jìn)行定義，這與將它們作為自由懸掛式代碼塊在“類”定義外部定義截然相反。使用Backbone.js事件語法，采用jQuery幕后委托機(jī)制。您始終可以根據(jù)用戶在表單中的輸入內(nèi)容采用以下不同方法來更新模型：(1)“實(shí)時(shí)”方法：使用更改處理程序在表單更改時(shí)更新模型。這種方法從本質(zhì)上而言是雙向數(shù)據(jù)綁定方法。模型和UI控件始終同步。您可以利用這種方法選擇將更改實(shí)時(shí)發(fā)送至服務(wù)器（隱式保存），還是等到用戶單擊Save按鈕時(shí)再發(fā)送更改（顯示保存）。***個(gè)選項(xiàng)在存在交叉字段驗(yàn)證規(guī)則時(shí)不正式也不可行。而第二個(gè)選項(xiàng)可能需要您撤銷模型更改，如果用戶在未單擊Save的情況下導(dǎo)航至其他項(xiàng)目的話。(2)“延遲”方法：等到用戶單擊Save時(shí)再根據(jù)UI控件的新值更新模型，然后將這些更改發(fā)送至服務(wù)器。本討論主題并非Backbone.js特有，因此本文并未就此進(jìn)行探討。為簡(jiǎn)單起見，我在此處使用延遲方法。但是，我依然導(dǎo)入更改事件，并利用其記錄控制臺(tái)更改。我發(fā)現(xiàn)此方法在調(diào)試應(yīng)用程序（特別是要確保我已經(jīng)清除綁定，請(qǐng)參見Close函數(shù)）時(shí)非常有效。如果您發(fā)現(xiàn)更改事件觸發(fā)多次，則可能沒有相應(yīng)地清除綁定。HeaderView（第125行至第148行）Backbone.js視圖通常用于呈現(xiàn)域模型（比如W