在前兩篇文章中，我們使用ZK的MVVM功能來(lái)：

• 將數(shù)據(jù)加載到表中
• 使用表單綁定保存數(shù)據(jù)

我們已經(jīng)看到，用注解@NotifyChange（）裝飾方法時(shí)，在執(zhí)行完成后，將向Binder通知VM屬性的更改，以便Binder可以相應(yīng)地更新相應(yīng)的UI。
在這篇文章中，雖然我們?cè)趲?kù)存中實(shí)現(xiàn)了項(xiàng)目刪除的功能，但我們將看到如何在運(yùn)行時(shí)以編程方式更新UI組件。

目的

為我們的簡(jiǎn)單清單CRUD功能構(gòu)建刪除功能。

ZK功能實(shí)戰(zhàn)

• MVVM：BindUtils

使用MVVM BindUtils實(shí)施刪除我們將：

• 為刪除按鈕添加標(biāo)記，并為其分配onClick事件處理程序
• 在VM中實(shí)施命令方法' deleteItem（） '

標(biāo)記

<window apply='org.zkoss.bind.BindComposer' viewModel='@id('vm') @init('...InventoryVM')'><toolbar width='100%'><toolbarbutton label='Add' onClick='@command('createNewItem')' /><toolbarbutton label='Delete' onClick='@command('deleteItem')' disabled='@load(empty vm.selected)'/></toolbar>

• 第5行，將命令方法' deleteItem '分配給刪除按鈕的onClick處理程序
• 第5行，' disabled ='@（empty vm.selected）' '確保僅當(dāng)選擇了表中的一個(gè)條目后，刪除按鈕才起作用

ViewModel類

public class InventoryVM {private Item selected;private List<Item> items;...@Commandpublic void deleteItem() throws Exception{if (selected != null){String str = 'The item with name \''+selected.getName()+'\' and model \''+selected.getModel()+'\' will be deleted.';Messagebox.show(str,'Confirm Deletion', Messagebox.OK|Messagebox.CANCEL, Messagebox.QUESTION, new EventListener<event>(){@Overridepublic void onEvent(Event event) throws Exception {if (event.getName().equals('onOK')){DataService.getInstance().deleteItem(selected);items = getItems();BindUtils.postNotifyChange(null, null, InventoryVM.this, 'items');}); } ...}... }

• 第7行，我們用@Command裝飾了deleteItem方法，因此可以將其作為onClick事件處理程序連接到我們添加的標(biāo)記中：
  <toolbarbutton label ='刪除'onClick ='@ command（'deleteItem'）'/> ;
• 第9行，只有選擇了一個(gè)項(xiàng)目，我們才繼續(xù)刪除過(guò)程。
• 第16行，我們顯示一個(gè)消息框，提示用戶確認(rèn)所選項(xiàng)目的刪除。
• 第20行，如果用戶單擊“確定”，我們的程序?qū)⒗^續(xù)刪除所選項(xiàng)目。
• 第23行，我們調(diào)用BindUtils.postNotifyChange（String queueName ，String queueScope ，Object bean ，String property ）更新清單表。 通過(guò)為參數(shù)queueScope提供空值，將使用默認(rèn)的桌面隊(duì)列范圍。 這樣給出第三個(gè)和第四個(gè)參數(shù)，因?yàn)槲覀兿胪ㄖ狟inder InventoryVM實(shí)例中的屬性“ items”已更改。 然后，活頁(yè)夾將更新UI（刪除庫(kù)存表中的物料條目）。

包起來(lái)

@NotifyChange注釋使我們可以通過(guò)ZK MVVM的Binder更新UI，以反映對(duì)ViewModel屬性所做的更改。 當(dāng)帶注釋的方法完成執(zhí)行時(shí)，將觸發(fā)該通知。 在我們的實(shí)現(xiàn)中，我們將匿名事件偵聽(tīng)器類附加到Messagebox。 在這種情況下，在執(zhí)行deleteItem之后，注釋@NotifyChange（'items'）將在事件處理完成之前錯(cuò)誤地提醒Binder。 通過(guò)編程方式將ViewModel中的狀態(tài)更改反映到UI，可以方便地解決此特定問(wèn)題。

接下來(lái)，使用MVVM編輯條目。

參考： ZK in Action [2]：MVVM –通過(guò)Tech Dojo博客上的JCG合作伙伴 Lance Lu以編程方式更新視圖 。

翻譯自: https://www.javacodegeeks.com/2012/07/zk-in-action-mvvm-update-view.html

總結(jié)

以上是生活随笔為你收集整理的ZK的实际应用：MVVM –以编程方式更新视图的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。