华为云Astro轻应用-标准页面:模型视图
模型视图
标准页面是通过数据模型驱动的,页面所有的逻辑都是围绕数据模型展开的。在将模型与前台页面组件或者后台逻辑绑定后,开发者只需要关注模型数据的实例化和处理,不需要关注页面的渲染和展示。
在页面底部,单击“模型视图”,即可从“设计视图”切换到“模型视图”,在模型视图下,可以查看、编辑以及管理数据模型,如图6所示。
模型定义
标准页面支持表1中四类模型,每类模型都包含参数定义和方法定义。方法是在模型上定义的API,通常会在前端组件关联的事件脚本(例如页面加载事件、鼠标单击事件)中调用这些API,以实现一定的逻辑。
模型分类 |
模型说明 |
模型参数的定义 |
模型方法的定义 |
API调用方法 |
---|---|---|---|---|
自定义模型 |
自定义模型是由开发者自由定义的模型。 |
参数由开发者自定义,可以添加子节点。 |
开发者自定义方法。 |
$model.ref("modelName").actionName(); |
对象模型 |
对象模型是直接与Object对象表映射生成的。 |
系统自动获取Object所有的字段,开发者可以从中选择部分字段作为参数。 |
平台自动生成查询、保存、删除和统计4个方法。 |
|
服务模型 |
服务模型是与后台服务映射生成的,当前支持与服务编排或Script映射。 |
参数根据后台服务的入参、出参映射生成为inputParam和outputParam节点。 |
平台自动生成了run方法 ,用于执行模型关联的服务编排或者Script。 |
$model.ref("modelName").run(); |
事件模型 |
事件模型是与后台事件的字段映射生成的,并且支持websocket刷新模型数据。 |
参数根据后台事件的字段映射生成。 |
平台自动生成了run方法 ,用于执行模型关联的服务编排或者Script。 |
$model.ref("modelName").run(); |
除了在模型中定义的方法,AstroZero还提供了如下标准API:
- 获取模型数据:$model.ref("modelName").getData();
- 设置模型数据:$model.ref("modelName").setData();
- 设置模型字段值:$model.ref("modelName").setValue(key,value);
模型绑定
模型与前端组件的绑定分为值绑定和属性绑定,绑定会在指定组件上创建双向数据绑定。
- 典型的值绑定场景有:表单、表格、列表视图对应的model绑定,以及输入框、下拉框等基础组件对应的value绑定,类似Vue的v-model。
- 典型的属性绑定场景有:下拉框的选项值、步骤条的步骤值等,类似Vue的v-bind。
如图7所示的例子中,实现了表格DataGrid组件与值的绑定。
- Astro轻应用_低代码开发平台Astro Zero_新手入门
- Astro轻应用_Astro大屏应用_分钟级构建业务大屏
- 华为云低代码平台_低代码开发平台_华为云Astro-华为云
- Astro轻应用_低代码开发平台Astro Zero_码农防脱神器
- Astro轻应用_零代码平台_开发无忧加速创新
- 低代码开发平台好用吗_低代码平台_Astro低代码-华为云
- 零代码开发平台_托拉拽开发应用_华为云Astro-华为云
- 低代码开发平台_华为云低代码_Astro Zero
- 零代码开发如何创建应用_零代码开发平台_华为云Astro-华为云
- Astro低代码平台关键能力_低代码开发平台_华为云Astro-华为云