检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
在高级页面组件包的widget_demo_mintui.js/render方法中,新增Vue实例。 更多关于Vue的使用,可参考Vue官网。 Vue.use(MINT); var vm = new Vue({ el: $("#widget_demo_mintui", elem)[0]
关闭Vue3框架渲染组件开关 本案例所涉及到的自定义组件是基于Vue2框架开发的,而系统是默认开启Vue3框架渲染组件的,所以您需要手动关掉Vue3框架渲染组件开关,否则拖拽组件到页面时会提示如下报错。 图1 界面报错 操作步骤 进入创建“设备维修管理系统”应用中创建的应用。 在
如何引入第三方库 如果您希望使用第三方库文件,而当前系统中不存在该库,您可以通过上传,新增该JS/CSS库,并在页面中设计并使用该库,实现引入第三方库的功能。本节将介绍如何引入并使用第三方库的具体操作步骤。 什么是库 库是指在设计页面时,需要依赖的库,若缺少相应的依赖库,则页面中
组件的描述信息,按需进行设置。此处配置的信息,将会在组件详情页的“概况”页签中进行显示。 自定义组件 关闭Vue3框架渲染组件开关。 本实践所涉及到的自定义组件是基于Vue2框架开发的,而系统是默认开启Vue3框架渲染组件的,所以您需要手动关掉Vue3框架渲染组件开关,否则拖拽组件到页面时会提示如下报错。 图5 界面报错
在标准页面中,使用视频组件来进行视频播放,支持播放的视频格式有MP4、OGV和WebM。 图1 视频播放 数据绑定 通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:值绑定类似vue中的v-model语法,组件上创建双向数据绑定。值绑定会根据组件类型,自动选取正确
ue3”开关。 图1 高级设置 当前版本的高级页面中,提供了Vue2和Vue3两种框架的组件,如果需要使用Vue2框架的组件,需要关闭“页面组件的渲染框架由Vue2升级为Vue3”,否则会提示图2中信息。 图2 界面报错 父主题: 使用AstroZero对应用进行个性化设置
默认行布局 您也可以通过单击,手工输入的方式自行设置列的分隔比例,比例相加份数总和必须为24,例如12:12、6:18、3:21、8:8:8等。自定义比例以英文冒号分隔。 分栏组件会根据分辨率大小自适应,当画布宽度小于992像素,PC会展示为单列模式,此时可以通过调整左侧菜单收缩或者画布分辨率来查看不同的效果。
示、数据切换,系统内置的表格组件中已包含了分页组件。 图1 分页组件 数据绑定 通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:值绑定类似vue中的v-model语法,组件上创建双向数据绑定。值绑定会根据组件类型,自动选取正确
lobal_Vue”的,需要写在“global_Vue”之后。依赖关系的详细介绍,请参见如何引入第三方库。 在“widget_demo_i18n.js”的render方法中,使用平台提供的“HttpUtils.getI18n”方法返回一个“i18n”变量,并新建Vue实例传入该“i18n”变量。
输入框是基础输入组件,输入框中的内容可以通过鼠标或键盘输入。输入框一般在有需要输入内容、提供组合型条件查询或有其他资料需要提交时使用。 图1 输入框组件 数据绑定 通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:值绑定类似vue中的v-model语
存储:存储器类型。 OBS:通过OBS类型连接器,存储到OBS上。 MINIO:通过MINIO类型连接器,存储到MINIO上。 OBJECTSTORAGEPROXY:通过OBJECTSTORAGEPROXY类型连接器,存储到相应服务器上。 CUSTOMAPI:通过自定义接口,来上传和展示文件。
栅格容器用于对页面区域按照行列布局划分,先分为多个分栏,每个分栏再分为多栏。 图1 栅格容器 数据绑定 通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:值绑定类似vue中的v-model语法,组件上创建双向数据绑定。值绑定会根据组件类型,自动选取正确
设置AstroZero系统通知方式 使用AstroZero开发应用的过程中,开发者可能需要向用户或系统发送各种类型的通知信息,这些通知可以包括系统状态更新、任务分配、消息提醒和警报通知等。在AstroZero中,支持通过邮件和短信两种方式,向用户发送通知消息。如果您没有配置当前环
设置AstroZero标准页面下拉框组件属性 下拉框通过配置绑定选项内容,提供给用户进行下拉选择的操作,支持单选、多选、搜索,以及键盘快捷操作。 图1 下拉框组件 数据绑定 通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:值绑定类似vue中的v-model语
两部分,可以通过切换标签来控制详情展示模块中的展示内容。 图1 标签切换效果 本章节主要在高级页面中,通过两个组件(标签页组件、信息展示组件)复现上述场景。其中,标签页组件包含产品类别(手机、笔记本、平板等),信息展示组件用于展示不同产品类别的图片信息。两个组件通过事件-动作机制
创建应用 创建“设备维修管理系统”应用 关闭Vue3框架渲染组件开关 了解应用目录及菜单 创建“业务用户登录”页面 父主题: 通过AstroZero开发设备维修管理应用
按钮一般在用户单击触发业务逻辑时使用,按钮组件提供单击触发事件能力。 图1 按钮组件 数据绑定 通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:值绑定类似vue中的v-model语法,组件上创建双向数据绑定。值绑定会根据组件类型,自动选取正确
同时,支持用户根据实际业务需求,进行二次修改编排。 图1 表格组件 数据绑定 通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:值绑定类似vue中的v-model语法,组件上创建双向数据绑定。值绑定会根据组件类型,自动选取正确
之间有依赖关系,增加库文件需要有先后顺序,例如“global_VueI18n”是基于“global_Vue”的,需要写在“global_Vue”之后。具体的依赖关系可参考如何引入第三方库中“系统预置库列表”。 在Widget包的widget_demo_mintui.ftl中写一个简单的表单DOM。
zip)的widget_demo_mintui.js的render方法中新增Vue实例。 Vue.use(MINT); var vm = new Vue({ el: $("#widget_demo_mintui"