@id(..) | 用于标识实例的id,例如视图模型或窗体 |
@init(..) | 用于初始化实例 |
@load(..) | 用于绑定数据和命令以及用于将数据加载到目标的参数 |
@save(..) | 用于绑定数据和命令以及用于保存数据的参数 |
@bind(..) | 用于绑定数据以及用于加载和保存的参数 |
@ref(..) | 用于引用表达式 |
@converter(..) | 用于指定转换器及其参数 |
@validator(..) | 用于指定验证器和参数 |
@command(..) | 用于将事件与参数绑定到命令 |
@global command(..) | 用于将事件与参数绑定到全局命令 |
@template(..) | 用于确定要呈现容器组件的模板 |
1),ZK中常用的字符
- 一些el字符在xml属性或zk注释中是非法的,您应该用其他el运算符替换它们。
= | eq |
!= | ne |
&& | and |
< | lt |
<= | le |
> | gt |
>= | e |
例如:
<h5 if="${arg.action eq 'create'}">新增</h5>
<h5 if="${arg.action ne 'create'}">修改</h5>
2),@init at viewModel Attribute
-
我们通常使用此注释的第一个地方是将ViewModel分配给ViewModel属性中的组件。
-
使用时在viewmodel属性中,我们应该在@init中的字符串文字中指定完整的限定类名。
使用如下例如:
<z:div
viewModel="@id('vm') @init('com.tuogo.sephora.rb.system.zk.mvvm.SecUserFormVM')">
</z:div>
3),@init at Form Binding
- 我们还可以使用表单绑定上的初始绑定来填充预定义的值。
- 是和viewmodel一起使用的
使用如下:
<z:div
viewModel="@id('vm') @init('com.tuogo.sephora.rb.system.zk.mvvm.SecUserFormVM')"
form="@id('m') @load(vm.domainModel) @save(vm.domainModel,before={'submit'})">
</z:div>
4),Iteration Variable-迭代变量使用
-
我们通常使用带有<template>的集合绑定,并指定其“var”属性来命名迭代变量,该变量表示集合的每个条目
-
如果不在var中指定迭代变量名,var的默认名称是:each。
使用如下
<template name="model" var="item">
...
</template>
5),Implicit Iteration Status Variable-隐式迭代状态变量
-
zk根据迭代变量的名称自动设置迭代状态的变量名,该变量存储迭代索引。
-
例如,如果设置var=“item”,则迭代索引将是itemstatus.index:
-
如果不在var中指定迭代变量名,则隐式迭代状态的默认变量名为:ForEachStatus。
<listbox>
<template name="model" var="item">
<listitem >
<listcell label="@load(itemStatus.index)"/>
</listitem>
</template>
</listbox>
6),Binding on Listbox-绑定到列表框
<listbox model="@load(vm.orders)" selectedItem="@bind(vm.selected)" hflex="true" height="200px">
<listhead>
<listheader label="Row Index"/>
<listheader label="Id"/>
<listheader label="Quantity" align="center" width="80px" />
<listheader label="Price" align="center" width="80px" />
<listheader label="Creation Date" align="center" width="100px" />
<listheader label="Shipping Date" align="center" width="100px" />
</listhead>
<template name="model" var="item">
<listitem >
<listcell label="@load(itemStatus.index)"/>
<listcell label="@load(item.id)"/>
<listcell label="@load(item.quantity)" style="@load(item.quantity lt 3?'color:red':'')"/>
<listcell label="@load(item.price)"/>
<listcell label="@load(item.creationDate)"/>
<listcell label="@load(item.shippingDate)"/>
</listitem>
</template>
</listbox>
- 我们将ListBox的模型绑定到集合类型属性:list<order>
-
我们将“selectitem”绑定到集合中具有相同对象类型(顺序)的ViewModel属性。每次用户选择列表框中的一项,活页夹将所选对象保存到ViewModel。因此,我们可以得到用户的选择
-
“var”属性的值:item表示模型的一个对象,因此使用点表示法引用它的属性,例如项目数量。它在集合中的索引可以由itemstatus.index引用。
-
借助el的强大功能,我们可以在zul上实现简单的表示逻辑。这里我们用红色显示数量。颜色小于3。
7),@ToServerCommand
- 放置我们要通知由客户机绑定器触发的服务器的命令。只注意我们的命令放入此注释将在服务器上接收。
-
注意:如果注释的值包含值“*”,则表示接受所有命令以通知服务器。
具体使用参考这篇文章 https://blog.csdn.net/qq_40646143/article/details/85716973
8),@WireVariable
- 如果成员字段在ViewModel中由@wirevariable注释,则变量(如果存在)将连接到此字段中。
- 在连接活页夹和ViewModel之前自动执行。有关接线变量的详细信息,请阅读接线变量。
下面是它的使用
public class OrderVM {
@WireVariable
private MessageService messageService;
...
}
9),@Wire
-
尽管MVVM模式的设计原则是ViewModel不应该引用UI组件,但是zk仍然提供两种方法来检索ViewModel中的UI组件。但是,我们不建议这种用法,因为它会丢失视图模型的一个重要优势:与视图的松散耦合。
例如页面输入框,后台可以根据id获取到输入到输入框的内容,使用如下
<div class="col-lg-10">
<z:textbox id="channel"
sclass="form-control"
value="@load(m.channel)"
readonly="true"
/>
</div>
后台获取如下
@Wire("#channel")
private Textbox channel;
10),@AfterCompose
@AfterCompose
@AfterCompose(superclass=true)
- 作用范围:类或者方法上
- 标记注释以标识将在BindComposer的doAfterCompose()中调用的生命周期方法。
-
在ViewModel类中,最多只允许有一个@ Aftercompose-annotated注释的方法。如果你设置注释元素父类为true时,首先调用ViewModel的父类的@Aftercompose-annotated注释的方法子类,这个逻辑在父类上重复。如果一个类没@AfterCompose方法,则不会调用任何方法(包括父类的).
例如:
例如,在类层次结构中:a(有@AfterCompose) <- B(有@AfterCompose) <- C(没有@AfterCompose) <- D(有)
@AfterCompose,superclass= true)。D是最后一个子类。
当BindComposer在doAfterCompose()中开始处理D时,它将调用D的@AfterCompose方法。
当BindComposer到达C时,将不调用任何方法。
当BindComposer到达B时,它会调用“then B’s”。
当BindComposer到达A时,它将调用A。
我们还可以在AfterCompose方法的参数上使用与参数相关的注释就像我们在@Init中所做的那样,
请参考语法/视图模型/参数小节。
如果你重写父类的@ aftercomposition注释的方法,例如parent .m1() <- Child.m1()。因为Java的
由于限制,BindComposer仍然调用Child.m1(), Child.m1()将被调用两次。为了避免这种情况,您应该设置
对于child.m1(),superclass=false,并在其中调用super.m1()。