关闭Vue3框架渲染组件开关 本案例所涉及到的自定义组件是基于Vue2框架开发的，而系统是默认开启Vue3框架渲染组件的，所以您需要手动关掉Vue3框架渲染组件开关，否则拖拽组件到页面时会提示如下报错。 图1 界面报错 操作步骤 进入创建“设备维修管理系统”应用中创建的应用。 在

查看更多 →

Loading 是否解构 开启 入口路径 本示例不填 版本号 0.1.20 CDN 本示例不填 单击“保存”。 绑定事件 在中心画布中选中按钮组件。 在右侧属性设置面板选择“高级”。 鼠标悬停在“绑定事件”上，将显示事件列表。 在事件列表中，单击OnClick事件。 在弹框中输入

查看更多 →

将组件保存为卡片 操作场景 将组件保存为卡片，方便后期有需要时，随时调用“我的卡片”中的组件。 操作步骤 参考登录AstroCanvas界面中操作，登录AstroCanvas界面。 在编辑页面状态下，选中组件，单击右键，选择“保存为卡片”。 图1 选择保存为卡片 您也可以在“图层

查看更多 →

npm包的cdn链接，因此使用以下npm包时，无需添加cdn链接。 @vueuse/core @vueuse/shared axios pinia vue vue-i18n vue-router vue/server/renderer @opentiny/vue 父主题： 使用工具类方法

查看更多 →

发行说明 组件的描述信息，按需进行设置。此处配置的信息，将会在组件详情页的“概况”页签中进行显示。 自定义组件 关闭Vue3框架渲染组件开关。 本实践所涉及到的自定义组件是基于Vue2框架开发的，而系统是默认开启Vue3框架渲染组件的，所以您需要手动关掉Vue3框架渲染组件开关，否则拖拽组件到页面时会提示如下报错。

查看更多 →

<script setup> import * as vue from 'vue' import { defineProps, defineEmits } from 'vue' import { I18nInjectionKey } from 'vue-i18n' const props =

查看更多 →

。 *.vue：用于定义 Vue 组件，包括模板（HTML）、脚本（JavaScript）和样式（ CSS ）。 组件协议结构规范 组件协议结构规范用于描述组件的关键信息和配置项，对应组件的components字段。 表1 组件协议结构规范 字段 说明 类型 name 组件名称，已“i18n”形式配置。

查看更多 →

当需要使用页面宏来存储变量时，请选用该模板。 下载组件模板。 根据需求选择模板，在组件模板详情页中单击“下载”按钮，在“下载组件模板”弹窗中输入组件名称，单击“保存”按钮即可。 本章节示例中同时开发标签页组件和信息展示组件，由于本例中组件基于Vue框架实现，所以优先选择widgetVueT

查看更多 →

将AstroZero系统预置的模板到本地。 开发自定义组件 基于下载的模板，在本地根据自身业务需求开发组件。 上传组件到组件库并使用组件 将开发完的自定义组件上传到组件库，并在高级页面中使用。 本章节以开发网站中常用的标签切换页面为例，向您介绍如何基于组件模板在线开发组件。参考华为消费者业务网站（如图1

查看更多 →

组件的描述信息，按需进行设置。此处配置的信息，将会在组件详情页的“概况”页签中进行显示。 自定义组件 关闭Vue3框架渲染组件开关。 本实践所涉及到的自定义组件是基于Vue2框架开发的，而系统是默认开启Vue3框架渲染组件的，所以您需要手动关掉Vue3框架渲染组件开关，否则拖拽组件到页面时会提示如下报错。 图5

查看更多 →

// 组件包说明文件 组件zip包的目录及文件的名称不能是中文，且编译后的组件包大小应在1M以内。 组件名遵循Vue组件命名，并且要在当前应用中唯一。您可参考Vue框架指南定义Vue组件代码，并参考Vue组件打包指南对Vue组件进行打包，打包后才能使用。 表1 组件包文件说明

查看更多 →

内容分发网络 CDN CDN使用HTTPS证书 CDN回源方式使用HTTPS CDN安全策略检查 CDN使用自有证书 父主题： 系统内置预设策略

查看更多 →

GET /v1.0/cdn/domains cdn:configuration:queryDomainList - POST /v1.0/cdn/domains cdn:configuration:createDomains - DELETE /v1.0/cdn/domains/{domain_id}

查看更多 →

发行说明 组件的描述信息，按需进行设置。此处配置的信息，将会在组件详情页的“概况”页签中进行显示。 自定义组件 关闭Vue3框架渲染组件开关。 本实践所涉及到的自定义组件是基于Vue2框架开发的，而系统是默认开启Vue3框架渲染组件的，所以您需要手动关掉Vue3框架渲染组件开关，否则拖拽组件到页面时会提示如下报错。

查看更多 →

} }) 将修改后的组件Widget包，重新打包。 参考开发高级组件中操作，将高级页面组件包上传至组件库中，在页面上中添加该高级页面组件。 当高级页面中拖入widget_demo_mintui高级页面组件后，即可在“页面设置 > 资源”中发现Vue库和MintUI库已加载，表示引用成功。

查看更多 →

</div> 参考6中操作，在组件库中上传该Widget包。 打开一个高级页面，在设计页面左上方单击，从“自定义”组件中拖出刚创建的Widget至右侧空白页面。 单击页面上方的，保存高级页面。 切换环境语言，在不同语种下，在页面中选中拖出的Widget，会在右侧显示该组件的属性配置面板，查看Widget属性是否符合预期。

查看更多 →

如何实现页面组件间的交互 组件之间的交互主要依托数据的变化和传输实现，将组件的属性与对应的数据进行绑定。当其他组件的事件、服务编排、事件等使属性绑定值发生变化时，绑定的属性也随即发生变化，实现了组件之间的交互。 数据绑定方式 在标准页面开发界面，选中任意组件，在右侧“属性”页签进行数据绑定。

查看更多 →

调试工具 Vue Devtools是一个专为Vue.js开发者设计的浏览器扩展。它提供了一系列强大的功能，帮助开发者更容易地调试和优化他们的Vue应用程序。 Vue Devtools 以下是Vue Devtools的主要特点和功能： 组件树查看：允许用户查看完整的Vue组件层次结构

查看更多 →

在开发高级页面过程中，可以使用预置的组件，快速构建页面；也可以自定义组件构建页面。 开发自定义组件时，可以根据组件功能下载组件模板进行开发。 组件模板名称 功能 widgetVueTemplate 当自定义组件需要使用Vue库时，请选用该模板。 widgetPropertyTemplate 当自定义组件需要通

查看更多 →

在菜单栏中，选择“高级设置”。 在“兼容性设置”页签中，开启“页面组件的渲染框架由Vue2升级为Vue3”开关。 图1 高级设置 当前版本的高级页面中，提供了Vue2和Vue3两种框架的组件，如果需要使用Vue2框架的组件，需要关闭“页面组件的渲染框架由Vue2升级为Vue3”，否则会提示图2中信息。 图2 界面报错

查看更多 →

mplate，再单击“下载”。 图1 下载组件模板 在弹出的窗口中，输入组件名称，并单击“保存”，将组件模板保存到本地，并解压。 图2 输入组件名称 查看解压后的组件目录。 目录结构如图3所示，其中userLogin.js文件是写vue业务逻辑的代码，userLogin.ftl用于写html代码，userLogin

查看更多 →