华为云用户手册

  • 属性 在属性中,设置翻牌器组件的位置、边框、背景等。 图2 属性 基础 组件标题:设置组件的标题。 组件名称:设置组件的名称。 位置 距离左端:组件到页面左侧的距离,单位为px。 距离顶端:组件到页面顶部的距离,单位为px。 宽度:组件的宽度,单位为px。 高度:组件的高度,单位为px。 堆叠顺序:设置组件层叠显示顺序。组件的堆叠顺序默认都是“1”,数字越大,显示越靠前。当需要让组件置底时,可设置堆叠顺序为“0”。 自适应高度:组件的高度是否随宽度改变。 边框:设置组件的边框样式,如全边框或角边框。 背景 样式:设置背景的样式,如普通、居中、拉伸等。 图片链接:背景图片URL。 颜色:设置背景的颜色。
  • 属性 在属性中,设置雷达图组件的位置、边框、背景等。 图2 属性 基础 组件标题:设置组件的标题。 组件名称:设置组件的名称。 位置 距离左端:组件到页面左侧的距离,单位为px。 距离顶端:组件到页面顶部的距离,单位为px。 宽度:组件的宽度,单位为px。 高度:组件的高度,单位为px。 堆叠顺序:设置组件层叠显示顺序。组件的堆叠顺序默认都是“1”,数字越大,显示越靠前。当需要让组件置底时,可设置堆叠顺序为“0”。 自适应高度:组件的高度是否随宽度改变。 边框:设置组件的边框样式,如全边框或角边框。 背景 样式:设置背景的样式,如普通、居中、拉伸等。 图片链接:背景图片URL。 颜色:设置背景的颜色。
  • 属性 在属性中,设置散点图组件的位置、边框、背景等。 图2 属性 基础 组件标题:设置组件的标题。 组件名称:设置组件的名称。 位置 距离左端:组件到页面左侧的距离,单位为px。 距离顶端:组件到页面顶部的距离,单位为px。 宽度:组件的宽度,单位为px。 高度:组件的高度,单位为px。 堆叠顺序:设置组件层叠显示顺序。组件的堆叠顺序默认都是“1”,数字越大,显示越靠前。当需要让组件置底时,可设置堆叠顺序为“0”。 自适应高度:组件的高度是否随宽度改变。 边框:设置组件的边框样式,如全边框或角边框。 背景 样式:设置背景的样式,如普通、居中、拉伸等。 图片链接:背景图片URL。 颜色:设置背景的颜色。
  • 如何设置数据系列 选中水位图组件,单击鼠标右键选择“高级设置”。 展开数据系列配置,单击旁边的“+”,添加数据系列。 在右侧“数据”页签,配置该数据系列的数据。 例如,在使用系统预置的静态数据基础上,添加如下加粗代码,配置新增数据系列的数据。也可以使用“动态数据”调用后台接口URL返回如下结构模型数据。 图4 新增数据系列 {"resCode": "0","resMsg": "成功","result": [{"dataValue": [{"name": "报警处理率","value": [{"value": 0.65,"name": ""}]},{"name": "命中率","value": [{"value": 0.15,"name": ""}]}]}]} 配置添加的数据系列图表位置、图表形状等。 设置完成后,单击“确定”。
  • 属性 在属性中,设置基本饼图组件的位置、边框、背景等。 图2 属性 基础 组件标题:设置组件的标题。 组件名称:设置组件的名称。 位置 距离左端:组件到页面左侧的距离,单位为px。 距离顶端:组件到页面顶部的距离,单位为px。 宽度:组件的宽度,单位为px。 高度:组件的高度,单位为px。 堆叠顺序:设置组件层叠显示顺序。组件的堆叠顺序默认都是“1”,数字越大,显示越靠前。当需要让组件置底时,可设置堆叠顺序为“0”。 自适应高度:组件的高度是否随宽度改变。 边框:设置组件的边框样式,如全边框或角边框。 背景 样式:设置背景的样式,如普通、居中、拉伸等。 图片链接:背景图片URL。 颜色:设置背景的颜色。
  • 属性 在属性中,设置基本饼图组件的位置、边框、背景等。 图2 属性 基础 组件标题:设置组件的标题。 组件名称:设置组件的名称。 位置 距离左端:组件到页面左侧的距离,单位为px。 距离顶端:组件到页面顶部的距离,单位为px。 宽度:组件的宽度,单位为px。 高度:组件的高度,单位为px。 堆叠顺序:设置组件层叠显示顺序。组件的堆叠顺序默认都是“1”,数字越大,显示越靠前。当需要让组件置底时,可设置堆叠顺序为“0”。 自适应高度:组件的高度是否随宽度改变。 边框:设置组件的边框样式,如全边框或角边框。 背景 样式:设置背景的样式,如普通、居中、拉伸等。 图片链接:背景图片URL。 颜色:设置背景的颜色。
  • 如何设置数据系列 选中基本饼图组件,单击鼠标右键选择“高级设置”。 展开数据系列配置,单击旁边的“+”,添加数据系列。 在右侧“数据”页签,配置该数据系列的数据。 例如,在使用系统预置的静态数据基础上,添加如下加粗标红字体代码,配置新增数据系列的数据。也可以使用“动态数据”调用后台接口URL返回如下结构模型数据。 图6 两个数据系列不用圆心坐标设置 {"resCode": "0","resMsg": "成功","result": [{"dataValue": [{"name": "关键事件","value": [{"value": 635,"name": "工程管理"},{"value": 310,"name": "社会环境"}]},{"name": "类别","value": [{"value": 435,"name": "计算机"},{"value": 210,"name": "文学"}]}]}]} 配置添加的数据系列圆心坐标,如果不配置,两个数据系列会重叠。 设置完成后,单击“确定”。
  • 自定义布局样式 如果导航页面,想实现如下图所示布局效果,即整个页面不需要有滚动条,而其中导航组件区域和全局路由视图组件区域可随滚动条滚动时,可参考如下步骤实现。 图13 自定义布局样式页面效果 在头部组件的“.css”样式文件中,指定头部组件的高度。 样例代码如下: #headerWidget { height: 90px;} 参考基于预置组件进行自定义中操作,下载预置组件路由导航(示例),解压global_NavigatorWidget.zip。 修改解压后的“Navigator_Widget.css”文件,该文件是Widget的样式文件,在该文件中编写Widget的css样式。 样例代码如下: html[app=desktop] body { overflow: hidden;} #navigatorWidget, #global_RouterViewWidget { height: calc(100% - 90px); overflow: scroll;} 将修改后的头部组件和组件路由导航组件文件,重新打成zip包。 参考基于预置组件进行自定义中操作,上传重新打包后的组件。 在高级页面设计器左上方,单击,拖出上传的头部组件、路由导航组件和预置的路由视图组件至设计页面。 单击页面上方的,保存页面。 保存成功后,单击,发布页面。 发布成功后,单击,可查看页面效果。
  • 属性 在属性中,设置基本折线图组件的位置、边框、背景等。 图2 属性 基础 组件标题:设置组件的标题。 组件名称:设置组件的名称。 位置 距离左端:组件到页面左侧的距离,单位为px。 距离顶端:组件到页面顶部的距离,单位为px。 宽度:组件的宽度,单位为px。 高度:组件的高度,单位为px。 堆叠顺序:设置组件层叠显示顺序。组件的堆叠顺序默认都是“1”,数字越大,显示越靠前。当需要让组件置底时,可设置堆叠顺序为“0”。 自适应高度:组件的高度是否随宽度改变。 边框:设置组件的边框样式,如全边框或角边框。 背景 样式:设置背景的样式,如普通、居中、拉伸等。 图片链接:背景图片URL。 颜色:设置背景的颜色。
  • 高级设置 在高级设置中,选择设置的文本内容,在出现的配置弹窗中,可进行是否加粗、是否倾斜、字号、字体、文本颜色、背景颜色、对齐方式等配置。 图3 编辑器中文本配置 另外,若需要在文本中设置变量,变量值来自文本桥接器“TextConnector”中的配置,若配置为静态数据,变量值取自“outDatas”中配置的数据。 可变参数下标请从0开始,变量样式为“{0}”,预览页面后效果为“变量值”。带转义符“\”的变参不会被替换,例如文本组件内容为“\{1}{1\}{\1}”,预览页面后效果为“{1}{1}{1}”。连续两个转义符时,则第二个转义符失效,变参会被替换,例如文本组件内容为“\\{2}”,预览页面后效果为“\变量值”。 图4 文本中变量配置 图5 预览页面效果
  • 高级设置 在高级设置中,可设置图片填充类型。 图3 高级设置 图4 图片设置页面 图5 上传图片/视频 单击“选择图片”,在页面单击目录后的和,可管理图片目录。单击“上传图片/视频”,可进行上传操作。 选择“填充”表示图片不保证保持原有比例,图片拉伸填满整个容器。 选择“包含”表示图片保持原有尺寸比例,可能会在容器内留有空白。 选择“覆盖”表示图片表示原有尺寸比例,宽高至少有一个和容器一致,可能会让图片部分区域不可见。 选择“无”表示图片保持原有尺寸比例,同时保持图片原始尺寸大小。
  • 属性 在属性中,设置自定义背景框组件的位置、边框、背景等。 图2 属性 基础 组件标题:设置组件的标题。 组件名称:设置组件的名称。 位置 距离左端:组件到页面左侧的距离,单位为px。 距离顶端:组件到页面顶部的距离,单位为px。 宽度:组件的宽度,单位为px。 高度:组件的高度,单位为px。 堆叠顺序:设置组件层叠显示顺序。组件的堆叠顺序默认都是“1”,数字越大,显示越靠前。当需要让组件置底时,可设置堆叠顺序为“0”。 自适应高度:组件的高度是否随宽度改变。 边框:设置组件的边框样式,如全边框或角边框。 背景 样式:设置背景的样式,如普通、居中、拉伸等。 图片链接:背景图片URL。 颜色:设置背景的颜色。
  • 属性 在属性中,设置图片组件的位置、边框、连接器等。 图2 属性 基础 组件标题:设置组件的标题。 组件名称:设置组件的名称。 位置 距离左端:组件到页面左侧的距离,单位为px。 距离顶端:组件到页面顶部的距离,单位为px。 宽度:组件的宽度,单位为px。 高度:组件的高度,单位为px。 堆叠顺序:设置组件层叠显示顺序。组件的堆叠顺序默认都是“1”,数字越大,显示越靠前。当需要让组件置底时,可设置堆叠顺序为“0”。 自适应高度:组件的高度是否随宽度改变。 边框:设置组件的边框样式,如全边框或角边框。 背景 样式:设置背景的样式,如普通、居中、拉伸等。 图片链接:背景图片URL。 颜色:设置背景的颜色。 自定义属性列表:显示组件的自定义属性。 图片地址:直接输入图片地址,来展示图片。 连接器设置 使用连接器:是否使用连接器。 选择连接器类型:选择有存储功能的,支持OBS、MINIO和对象存储代理。 选择连接器:选择具体的连接器实例。 选择桶:连接器的存储桶。 使用相对地址:使用图片的相对路径。
  • 流式布局高级页面 在流式布局中,拖拽到页面中的组件,将根据从上到下、从左到右的顺序依次排列,组件的高度将根据组件内容大小进行自适应,宽度可按百分比进行配置。 创建流式布局类型高级页面。 参考如何登录新版应用设计器中操作,登录新版应用设计器。 在左侧导航栏中,选择“界面”,单击高级页面后的,进入添加高级页面。 设置高级页面标签和名称,布局类型选择“流式布局”,单击“添加”。 图9 新建流式布局类型高级页面示例 绝对布局类型高级页面与流式布局类型高级页面不同之处。 在流式布局类型高级页面中,不可拖拽组件位置和大小,同样在“组件属性设置”栏中,也没有位置相关的设置选项。因为流式布局下组件将按照从上到下、从左到右的顺序依次排列。 流式布局类型高级页面的画布划分为12列,新拖入的组件默认宽度为100%,即占据12列。 也可以通过拖拽组件最右侧边框,调节其所占列数。 图10 流式布局中调整组件宽度示例 当原上下排布的多个组件所占列数之和小于12时,会自动调整到同一行。如下图所示,三个组件的所占列数分别调整为4,则本例中三个组件将会按照从左到右的顺序依次排布。 图11 组件所占列数之和小于12 通过拖拽的方式,调整组件上下、左右的排布次序。 图12 调整组件上下、左右的排布次序示例 流式布局类型高级页面,在高级页面工具栏中新增悬浮模式,开启此模式后拖入的组件不再按照从上到下、从左到右的顺序依次排列,可以设置其相对位置。 图13 悬浮模式示例 上图中标注说明如下: 标注1:在高级页面工具栏中,开启悬浮模式。 标注2:拖入新组件。 标注3:悬浮模式下,组件相对位置设置选项。 相对定位 Screen:该组件基于当前视图的相对位置。 Layout:该组件基于当前布局的相对位置。 Widget:该组件基于其他组件的相对位置。 组件位置:设置相对定位的具体方位。 显示顺序:当组件出现堆叠时,可以设置组件的显示顺序,设置值越大,显示越靠前。 最大高度:设置该组件的最大高度,单位为px或%。 宽度:设置该组件的宽度,单位为px或%。
  • 绝对布局高级页面 创建绝对布局类型的高级页面。 参考如何登录新版应用设计器中操作,登录新版应用设计器。 在左侧导航栏中,选择“界面”,单击高级页面后的,进入添加高级页面。 设置高级页面标签和名称,布局类型选择“绝对布局”,单击“添加”。 图1 新建绝对布局类型高级页面 开发绝对布局类型的高级页面。 以开发如下所示高级页面为例,向您介绍绝对布局类型高级页面中组件的布局方法。 图2 绝对布局类型高级页面组件布局示例 如上图所示,示例页面中包含文本编辑、基本柱图和多区域折线图三个组件。 在高级页面右上方,单击,设置背景图片。 图3 设置页面背景色示例 查找并拖入该页面中包含的组件,通过拖拽进行初步位置、大小调整。 图4 拖拽所需的组件到画布中 设置文本编辑组件内容为“绝对布局类型高级页面”,字号为“大号”。 图5 设置文本编辑组件内容 通过组件属性,精确设置组件大小。 本例中,设置组件宽度为600px、高度为350px。 图6 精确设置组件大小 复制组件。 将上图左侧组件逐个复制,并将其拖拽到右侧,通过对齐提示线将其与左侧组件对齐。 图7 复制组件 单击页面上方的,保存页面。 单击,预览高级页面,查看当前页面在运行态的效果。 图8 预览高级页面
  • 事件 在事件中,显示了组件暴露出来的一些常用事件,供用户实现,来扩展组件的交互。整个页面有加载(on-load)事件,该事件在页面渲染完成后执行,可进行数据初始化操作。 表1 事件编排 事件名 说明 返回值 数据改变 已上传文件列表改变时触发。 当前已上传文件列表。 文件上传 开始上传文件时触发。 当前开始上传的文件。 当前已上传文件列表。 操作成功 上传成功后触发。 上传成功文件的地址。 选中文件 文件列表选中时或取消选中时触发。 当前文件。 已选中的文件。 文件上传前 文件上传前触发。 在“文件上传前”事件后,单击齿轮图标,在“自定义JS代码”中增加“$current.showUploadList = false”语句,可取消上传预览。 当前文件。 文件名。
  • 使用说明 低代码平台预置了很多默认样式,供您选择使用,同时也支持对标准页面的主题样式进行自定义修改。 自定义主题时,可以自定义修改标准页面的样式。设置完成并启用主题后,该应用中标准页面相同组件的展示,将以主题中配置为准。 例如,在标准页面中添加一个“表单”组件,并绑定数据对象为“Alarm”,选择前三个字段,添加“保存”和“重置”按钮,单击“完成”。单击“保存”按钮,再单击“预览”按钮,效果如图1启用前效果图所示。在主题中配置该输入框的背景色为红色,启用主题使得标准页面表单中输入框的背景色为红色,效果如图2启用后效果图所示。 图1 启用前效果图 图2 启用后效果图
  • 属性 数据绑定:通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:设置组件绑定的数据模型,数据模型一般有以下几种。更多介绍,请参见值绑定。 自定义:由用户自定义的前端模型,可以在模型树上快速创建自定义字段。 对象:由后台对象模型映射创建,支持选择字段。 服务:由后台服务的出入参数模型创建,分别生成inputParam和outputParam节点。 事件:由后台事件的字段映射创建,并且支持websocket刷新模型数据。 属性值绑定,用于对该组件所有属性的动态设置。当某一属性被动态绑定时,以绑定值为准。更多介绍,请参见属性绑定。 基本属性:基本属性通过数据绑定后,在运行时以数据绑定的值为准。 默认分页大小:设置默认每页条数(分页大小)。 每页条数切换的配置:每页条数切换的配置,如[10,20,40,100]。 大小:分页显示大小,可选值为small(迷你版)或不填(默认)。 简洁版:是否简洁版显示分页样式。 AUI风格:是否展示AUI风格。 显示跳转:是否显示跳转,显示后可设置快速跳转到某一页。 显示分页:是否显示分页,显示后可设置具体的分页大小。 公共 控件名称:当前组件的名称。 隐藏:是否隐藏该组件,此方式为静态配置该组件的隐藏。还可以将该组件属性值“隐藏”配置为布尔类型模型字段,在自定义JS代码中来控制模型字段取值,从而设置该组件是否隐藏,这种动态设置优先级是最高的。 样式 布局:设置组件的宽度、高度等。 字体:设置字体大小、字体样式、颜色等。 背景:设置背景颜色、透明度。 边框:设置边框颜色、宽度等,单位为px。 阴影:设置阴影颜色、模糊、扩散等,单位为px。 高级设置 样式源码:组件具体样式代码,组件样式设置后,样式代码将自动显示在“样式源码”中,也可以自定义样式代码,对组件进行详细配置,自定义代码支持多行输入,并高亮显示样式参数。 样式类:当前组件使用的 CSS 样式类名,可在 CS S代码中进行引用。
  • 属性 数据绑定:通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:设置组件绑定的数据模型,数据模型一般有以下几种。更多介绍,请参见值绑定。 自定义:由用户自定义的前端模型,可以在模型树上快速创建自定义字段。 对象:由后台对象模型映射创建,支持选择字段。 服务:由后台服务的出入参数模型创建,分别生成inputParam和outputParam节点。 事件:由后台事件的字段映射创建,并且支持websocket刷新模型数据。 属性值绑定,用于对该组件所有属性的动态设置。当某一属性被动态绑定时,以绑定值为准。更多介绍,请参见属性绑定。
  • 绑定数据模型 设置组件绑定的数据模型,有自定义对象、对象、服务和事件四种。 向页面中拖入一个表格(新)组件,单击“表格”页签,在表格属性“数据绑定”中单击,绑定数据模型。 图3 数据绑定 在弹出页面中,单击“新增模型”。 设置表格的数据模型,添加对象模型,模型名称“equipmentInstance”,单击“下一步”。 图4 创建数据模型 “选择对象”选择一个提前创建好的对象,例如“HW__Equipment__CST”,“选择字段”中选择表单中需要展示的字段,单击“下一步”。 图5 选择展示字段 在方法页面,单击“确定”,返回选择模型页面。 勾选刚建好的数据模型,单击“确定”。 绑定对象模型后,显示如图6所示。系统默认添加了斑马纹,如果不需要,可在表格属性的“基本设置”中关闭“斑马纹”。 图6 绑定数据模型后的结果列
  • 属性 数据绑定:通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:设置组件绑定的数据模型,数据模型一般有以下几种。更多介绍,请参见值绑定。 自定义:由用户自定义的前端模型,可以在模型树上快速创建自定义字段。 对象:由后台对象模型映射创建,支持选择字段。 服务:由后台服务的出入参数模型创建,分别生成inputParam和outputParam节点。 事件:由后台事件的字段映射创建,并且支持websocket刷新模型数据。 属性值绑定,用于对该组件所有属性的动态设置。当某一属性被动态绑定时,以绑定值为准。更多介绍,请参见属性绑定。 基本属性:基本属性通过数据绑定后,在运行时以数据绑定的值为准。 无数据显示:无数据时,显示的名称。 列数(PC):设置PC端显示列数。 列数(Mobile):设置移动端显示列数。 列数排列方式:选择列数排列方式,如居中、左对齐和右对齐等。 显示加载中:当要展示的内容较多时,用户看到页面内容可能需要稍长时间,开启加载中效果,体验会更好。 移动端配置:列表视图在移动端的设置。 下拉刷新:下拉是否刷新列表。 默认数据条数:设置移动端列表视图,默认展示数据的数量。 显示加载文字:是否显示上拉加载文字。 异步加载:和事件(on-load-data)配合使用,上拉加载时,异步获取数据。 公共 控件名称:当前组件的名称。 隐藏:是否隐藏该组件。 样式 布局:设置组件的宽度、高度等。 字体:设置字体大小、字体样式、颜色等。 背景:设置背景颜色、透明度。 边框:设置边框颜色、宽度等,单位为px。 阴影:设置阴影颜色、模糊、扩散等,单位为px。 高级设置 样式源码:组件具体样式代码,组件样式设置后,样式代码将自动显示在“样式源码”中。也可以自定义样式代码,对组件进行详细配置。自定义代码支持多行输入,并高亮显示样式参数。 样式类:当前组件使用的CSS样式类名,可在CSS代码中进行引用。
  • 属性值绑定 在列表视图的“属性”页签,单击“数据绑定”中的,绑定数据模型。 模型实例化必须为数组,详情请参见绑定数据模型、增加查询条件、工具栏。 图3 绑定数据模型 向列表视图中拖入栅格容器,将栅格容器设置为6行2列,再向前5行中拖入标签组件,并设置标签属性。 属性值绑定。 选择第一行、第二列中的标签,单击右侧“属性值绑定”的“+”,新增属性值绑定。 其中,“属性”设置为“文本内容”,再单击,添加模型字段,将模型字段绑定到当前标签上。 重复上一步,为其他行的标签组件进行属性值绑定。 在第6行拖入一个按钮,设置为“Handle”。 在页面上方,单击,保存页面。 保存成功后,单击,进入预览页面,预期效果如图4。 进行属性值绑定的标签组件,显示绑定的模型字段内容。 图4 通过属性值绑定获取模型中的数据
  • 属性 数据绑定:通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:设置组件绑定的数据模型,数据模型一般有以下几种。更多介绍,请参见值绑定。 自定义:由用户自定义的前端模型,可以在模型树上快速创建自定义字段。 对象:由后台对象模型映射创建,支持选择字段。 服务:由后台服务的出入参数模型创建,分别生成inputParam和outputParam节点。 事件:由后台事件的字段映射创建,并且支持websocket刷新模型数据。 属性值绑定,用于对该组件所有属性的动态设置。当某一属性被动态绑定时,以绑定值为准。更多介绍,请参见属性绑定。 基本属性:基本属性通过数据绑定后,在运行时以数据绑定的值为准。 配置菜单:单击“设置”,可设置菜单。 图标:配置菜单的图标。 文本内容:配置菜单的显示名称。 RUL类型:菜单跳转页面的URL类型,如“常量”、“选择页面”。 地址:当“URL类型”为“常量”时,需要配置跳转页面的具体URL地址。当“URL类型”为“选择页面”时,需要选择系统中创建的具体跳转页面。 链接目标:跳转后页面显示形式。 新窗口:在新窗口页,显示跳转页面。 当前框架:在当前框架,显示跳转页面。 父框架:在父框架区域,显示跳转页面。 整个窗口:在当前整个窗口,显示跳转页面。 分隔符:菜单名之间的分隔符。 跳转:单击面包屑组件的菜单标签,是否开启自动跳转,默认为开启。若不开启跳转,可在“事件”页签定义跳转的实现方法,即进行事件编排。 公共 控件名称:当前组件的名称。 隐藏:是否隐藏该组件,此方式为静态配置该组件的隐藏。还可以将该组件属性值“隐藏”配置为布尔类型模型字段,在自定义JS代码中来控制模型字段取值,从而设置该组件是否隐藏,这种动态设置优先级是最高的。 样式 布局:设置组件的宽度、高度等。 字体:设置字体大小、字体样式、颜色等。 背景:设置背景颜色、透明度。 边框:设置边框颜色、宽度等,单位为px。 阴影:设置阴影颜色、模糊、扩散等,单位为px。 高级设置 样式源码:组件具体样式代码,组件样式设置后,样式代码将自动显示在“样式源码”中,也可以自定义样式代码,对组件进行详细配置,自定义代码支持多行输入,并高亮显示样式参数。 样式类:当前组件使用的CSS样式类名,可在CSS代码中进行引用。
  • 属性 数据绑定:通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:设置组件绑定的数据模型,数据模型一般有以下几种。更多介绍,请参见值绑定。 自定义:由用户自定义的前端模型,可以在模型树上快速创建自定义字段。 对象:由后台对象模型映射创建,支持选择字段。 服务:由后台服务的出入参数模型创建,分别生成inputParam和outputParam节点。 事件:由后台事件的字段映射创建,并且支持websocket刷新模型数据。 属性值绑定,用于对该组件所有属性的动态设置。当某一属性被动态绑定时,以绑定值为准。更多介绍,请参见属性绑定。
  • 属性 数据绑定:通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:设置组件绑定的数据模型,数据模型一般有以下几种。更多介绍,请参见值绑定。 自定义:由用户自定义的前端模型,可以在模型树上快速创建自定义字段。 对象:由后台对象模型映射创建,支持选择字段。 服务:由后台服务的出入参数模型创建,分别生成inputParam和outputParam节点。 事件:由后台事件的字段映射创建,并且支持websocket刷新模型数据。 属性值绑定,用于对该组件所有属性的动态设置。当某一属性被动态绑定时,以绑定值为准。更多介绍,请参见属性绑定。 扩展 :单击“新增行”后的或者,可在当前“分栏”上方或者下方新增分栏(即新增行)。 公共 控件名称:当前组件的名称。 隐藏:是否隐藏该组件。 样式 布局:设置组件的宽度、高度等。 字体:设置字体大小、字体样式、颜色等。 背景:设置背景颜色、透明度。 边框:设置边框颜色、宽度等,单位为px。 阴影:设置阴影颜色、模糊、扩散等,单位为px。 高级设置 样式源码:组件具体样式代码,组件样式设置后,样式代码将自动显示在“样式源码”中。也可以自定义样式代码,对组件进行详细配置。自定义代码支持多行输入,并高亮显示样式参数。 样式类:当前组件使用的CSS样式类名,可在CSS代码中进行引用。
  • 属性 数据绑定:通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:设置组件绑定的数据模型,数据模型一般有以下几种。更多介绍,请参见值绑定。 自定义:由用户自定义的前端模型,可以在模型树上快速创建自定义字段。 对象:由后台对象模型映射创建,支持选择字段。 服务:由后台服务的出入参数模型创建,分别生成inputParam和outputParam节点。 事件:由后台事件的字段映射创建,并且支持websocket刷新模型数据。 属性值绑定,用于对该组件所有属性的动态设置。当某一属性被动态绑定时,以绑定值为准。更多介绍,请参见属性绑定。 基本属性 链接地址:输入自定义图片的图片地址。 图片地址:选择或上传图片,支持上传JPG、JPEG、PNG和GIF格式的图片,图片不超过1MB。 图片库有如下几种类型: OBS/MINIO/OBJE CTS TORAGEPROXY:通过连接器获取OBS或MINIO桶中的图片,需要提前配置OBS/MINIO/OBJECTSTORAGEPROXY类型连接器,选择具体的存储桶、连接器实现获取图片功能。 连接器:OBS/MINIO/OBJECTSTORAGEPROXY类型的连接器。 桶:OBS/MINIO类型连接器的存储桶。 SFTP:选择SFTP后,图片将加密上传至nginx服务器的本地文件系统中。 OBS/MINIO/OBJECTSTORAGEPROXY图片库,支持按目录管理图片: 单击目录后的和,新增根图片目录和子图片目录。 单击“上传图片”,可上传图片。 选中图片时,单击,可以在图片库中删除此图片。 预览:预览时,是否支持单击放大图片。 公共 控件名称:当前组件的名称。 隐藏:是否隐藏该组件,此方式为静态配置该组件的隐藏。还可以将该组件属性值“隐藏”配置为布尔类型模型字段,在自定义JS代码中来控制模型字段取值,从而设置该组件是否隐藏,这种动态设置优先级是最高的。 禁用:是否禁用该组件。 只读:值是否只读。 样式 图片宽度:设置图片的宽度和高度,单位为px。 布局:设置组件的宽度、高度等。 字体:设置字体大小、字体样式、颜色等。 背景:设置背景颜色、透明度。 边框:设置边框颜色、宽度等,单位为px。 阴影:设置阴影颜色、模糊、扩散等,单位为px。 高级设置 样式源码:组件具体样式代码,组件样式设置后,样式代码将自动显示在“样式源码”中。也可以自定义样式代码,对组件进行详细配置。自定义代码支持多行输入,并高亮显示样式参数。 样式类:当前组件使用的CSS样式类名,可在CSS代码中进行引用。
  • 属性 数据绑定:通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:设置组件绑定的数据模型,数据模型一般有以下几种。更多介绍,请参见值绑定。 自定义:由用户自定义的前端模型,可以在模型树上快速创建自定义字段。 对象:由后台对象模型映射创建,支持选择字段。 服务:由后台服务的出入参数模型创建,分别生成inputParam和outputParam节点。 事件:由后台事件的字段映射创建,并且支持websocket刷新模型数据。 属性值绑定,用于对该组件所有属性的动态设置。当某一属性被动态绑定时,以绑定值为准。更多介绍,请参见属性绑定。 移动端配置:页面在移动端的配置,如当页面下拉时,是否刷新页面。 公共 控件名称:当前组件的名称。 保持会话:开启后将会与服务端维持心跳连接,若用户长时间未操作,当监听到用户的鼠标或键盘事件时,会向后台发送请求刷新访问凭证。 ElementUI样式:低代码平台默认加载了ElementUI,开启后即可使用。 背景图片:单击,设置页面的背景图片。 样式 布局:设置组件的宽度、高度等。 字体:设置字体大小、字体样式、颜色等。 背景:设置背景颜色、透明度。 边框:设置边框颜色、宽度等,单位为px。 阴影:设置阴影颜色、模糊、扩散等,单位为px。 高级设置 样式源码:组件具体样式代码,组件样式设置后,样式代码将自动显示在“样式源码”中。也可以自定义样式代码,对组件进行详细配置。自定义代码支持多行输入,并高亮显示样式参数。 样式类:当前组件使用的CSS样式类名,可在CSS代码中进行引用。 水印 启用水印:页面是否启用水印。 水印内容:启用水印后,支持设置水印内容。 当前用户:当需要设置水印内容为当前用户名时,可开启该项。开启后,“水印内容”中的文本不生效。 水印长度:设置水印矩形框的长度。 水印宽度:设置水印矩形框的宽度。 重复渲染:当需要设置满页面水印时,可开启该项。 水平起始位置:关闭“重复渲染”时,才可设置,表示单个水印在页面的水平起始位置。 垂直起始位置:关闭“重复渲染”时,才可设置,表示单个水印在页面的垂直起始位置。 字体颜色:设置水印字体的颜色。 字体大小:设置水印字体的大小。 旋转角度:水印的旋转角度,取值范围-180~180,即逆时针或者顺时针旋转180度。 透明度:水印的透明度设置。
  • 属性 数据绑定:通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:设置组件绑定的数据模型,数据模型一般有以下几种。更多介绍,请参见值绑定。 自定义:由用户自定义的前端模型,可以在模型树上快速创建自定义字段。 对象:由后台对象模型映射创建,支持选择字段。 服务:由后台服务的出入参数模型创建,分别生成inputParam和outputParam节点。 事件:由后台事件的字段映射创建,并且支持websocket刷新模型数据。 属性值绑定,用于对该组件所有属性的动态设置。当某一属性被动态绑定时,以绑定值为准。更多介绍,请参见属性绑定。 扩展 :单击“新增行”后的或者,可在当前“分栏”上方或者下方新增分栏(即新增行)。 行布局 在“行布局”中,系统支持设置PC或者Phone手机端布局,并默认提供了一些常见的行布局,如单栏、二等分栏等。单击在“行布局”中的某一个模式,例如单击,当前分栏将被分割成3栏,如图3所示。 图3 默认行布局 您也可以通过单击,手工输入的方式自行设置列的分隔比例,比例相加份数总和必须为24,例如12:12、6:18、3:21、8:8:8等。自定义比例以英文冒号分隔。 分栏组件会根据分辨率大小自适应,当画布宽度小于992像素,PC会展示为单列模式,此时可以通过调整左侧菜单收缩或者画布分辨率来查看不同的效果。 图4 自定义行布局 布局模式:设置PC或Phone屏幕,每一个分栏的栏布局模式。 流式布局:页面元素的宽度,按照屏幕分辨率进行适配调整,但整体布局不变。 弹性布局:可以简便、完整、响应式的实现各种页面布局,选择“弹性布局”时还可以设置垂直对齐方式、水平排列方式以及分栏间隔。 公共 控件名称:当前组件的名称。 隐藏:是否隐藏该组件。
  • 控制组件只可读不可编辑 在用户填写调查问卷页面,选中“提交”按钮组件。 在右侧“事件”页签中,单击,进入添加动作页面。 在“内置动作”中,单击“只读/编辑控件”。 在右侧页面中,单击“添加控件”,选择需要设置的组件,单击“确定”。 图1 选择组件 设置组件是否可编辑,单击“创建”。 图2 设置是否可编辑 返回标准页面开发界面,单击页面上方的,保存页面。 单击,预览页面,填写问卷项后,单击“提交”按钮,可预览按钮的事件效果。
  • 属性 数据绑定:通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:设置组件绑定的数据模型,数据模型一般有以下几种。更多介绍,请参见值绑定。 自定义:由用户自定义的前端模型,可以在模型树上快速创建自定义字段。 对象:由后台对象模型映射创建,支持选择字段。 服务:由后台服务的出入参数模型创建,分别生成inputParam和outputParam节点。 事件:由后台事件的字段映射创建,并且支持websocket刷新模型数据。 属性值绑定,用于对该组件所有属性的动态设置。当某一属性被动态绑定时,以绑定值为准。更多介绍,请参见属性绑定。 基本属性 弹性布局:是否开启弹性布局。开启后,可以简便、完整、响应式的实现各种页面布局。 列数:设置表单的列数。开启弹性布局时,才显示该配置。 标签对齐方式:设置标签对齐方式,如左对齐、右对齐和上侧对齐。 动态表单数据:请输入SON格式的选项内容。 公共 控件名称:当前组件的名称。 隐藏:是否隐藏该组件,此方式为静态配置该组件的隐藏。还可以将该组件属性值“隐藏”配置为布尔类型模型字段,在自定义JS代码中来控制模型字段取值,从而设置该组件是否隐藏,这种动态设置优先级是最高的。 禁用:是否禁用该组件。 只读:值是否只读。 样式 布局:设置组件的宽度、高度等。 字体:设置字体大小、字体样式、颜色等。 背景:设置背景颜色、透明度。 边框:设置边框颜色、宽度等,单位为px。 阴影:设置阴影颜色、模糊、扩散等,单位为px。 高级设置 样式源码:组件具体样式代码,组件样式设置后,样式代码将自动显示在“样式源码”中。也可以自定义样式代码,对组件进行详细配置。自定义代码支持多行输入,并高亮显示样式参数。 样式类:当前组件使用的CSS样式类名,可在CSS代码中进行引用。
共100000条