我正在使用ZKOSS MVVM。 所以在View中我使用的是一个Listbox,它被绑定(@load)到ViewModel中的列表模型对象。
我从文档中了解到,如果我更改模型
1:将对象添加到索引0的View Model中的列表模型
I should see the latest object be appended at top of the Listbox.
2:从模型中删除项目
I should see that particular row from Listbox be removed.
注意:这是一个像社交网络这样的界面,例如当有人创建帖子并将新帖子附加到帖子列表时Facebook壁。如果删除帖子,则仅从列表中删除该帖子
嗯,它确实发生了(新项目被追加/删除项目被删除)但整个列表框重新加载,而不仅仅是添加或删除的特定行。
为什么?为什么Listbox会在列表模型更改时完全重新加载。
有什么想法吗?
以下是代码段(用例:添加新帖子适用。每次创建新帖子整个列表框重新加载):
查看
<z:div style="height: 100%; padding: 0px; margin: 0px;" apply="org.zkoss.bind.BindComposer"
viewModel="@id('want_vm') @init('want.WantDesktopVM')">
<z:div zclass="content">
<g:render template="../css/list/noEffectList"></g:render>
<z:div hflex="1" width="100%" visible="@load(want_vm.toggleInput)" style="margin-bottom: 5px; padding: 5px">
<z:vbox>
<z:textbox id="postInput" multiline="true" value="" width="690px" height="50px"/>
<z:div hflex="1" width="100%" style="text-align: right; padding-right: 5px">
<z:button label="Post" zclass="button rect theme" onClick="@command('post', text=postInput.value)"/>
</z:div>
</z:vbox>
</z:div>
<z:listbox model="@load(want_vm.posts)" emptyMessage="No new posts found." style="border:none;">
<z:template name="model" var="iwant">
<listitem style="margin-top: 10px">
<listcell>
<hbox hflex="true">
<div zclass="dpFrame small">
<image height="50px" width="50px" content="@load(iwant.from) @converter('converter.UserActorDisplayPicConverter')" />
</div>
<vbox hflex="true" zclass="post">
<hbox hflex="true">
<label value="@load(iwant.from) @converter('converter.ActorDisplayNameConverter')" zclass="displayName"/>
</hbox>
<hbox hflex="true">
<label value="@load(iwant.textData)" zclass="post_data" multiline="true" maxlength="25"/>
</hbox>
<hbox>
<label value="@load(iwant.dateCreated) @converter('converter.SinceDateConverter')" zclass="since"/>
</hbox>
</vbox>
</hbox>
</listcell>
</listitem>
</z:template>
</z:listbox>
</z:div>
视图模型
class WantDesktopVM {
UserActorManagerService userActorManagerService
ActivityManagerService activityManagerService
UserActor me
UserActor profile
String error = null
String view = 'iwant'
@Wire
Textbox postInput
private List<Activity> posts = []
@Init
public void init(@ContextParam(ContextType.COMPONENT) Component component,
@ContextParam(ContextType.VIEW) Component view) {
profile = Executions.current.getAttribute("profile")
me = Executions.current.getAttribute("me")
loadPosts()
}
@AfterCompose
public void afterCompose(@ContextParam(ContextType.VIEW) Component view) {
Selectors.wireComponents(view, this, false);
}
public boolean isMyProfile() {
return me.id == profile.id
}
public UserActor getMe() {
return this.me
}
public boolean isToggleInput() {
return this.view == 'iwant' && isMyProfile()
}
public List<Activity> getPosts() {
println "Getting posts ...${posts.size()}"
return this.posts
}
private List<Activity> loadPosts() {
if(view == 'iwant') {
posts = Activity.createCriteria().list() {
eq 'from', profile
eq 'type', ACTIVITY_TYPE.WANT
order("lastUpdated", "desc")
}
} else {
posts = ActorActivitySpace.createCriteria().list() {
projections {property("activity")}
eq 'actor', profile
activity {
ne 'from', profile
eq 'type', ACTIVITY_TYPE.WANT
}
order("lastUpdated", "desc")
}
}
return posts
}
@NotifyChange(['posts', 'toggleInput'])
@Command
public void render(@BindingParam('view') String view) {
println "Changing view ..."
this.view = view
loadPosts()
}
@NotifyChange('posts')
@Command
public void post(@BindingParam('text') String text) {
println "Posting text: $text"
postInput.setValue("")
if(text) {
Activity want = activityManagerService.want(me.id, text)
println"Want ID : $want.id"
posts.addAll(0, [want])
}
}
}
答案 0 :(得分:5)
您使用@NotifyChange('posts')
告诉ZK整个列表已更改。网格不会尝试检查列表,只是将其当前ListModel
替换为新列表 - &gt;完全重装。
如果您不想这样,则必须使用网格使用的ListModel
方法来更新ui。这样,网格就会确切知道哪些行已更改,只更新那些行。
[编辑] 要实现您的目标,请将List<Activity> posts
替换为ListModelList<Activity> posts = new ListModelList<Activity>()
当活动发生变化时,您必须更新此列表(即致电add()
或addAll()
)以更新各行。您无法再从数据库加载所有内容,您必须使用现有列表合并数据库中的更改。