检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
使用JS面板 在常规代码开发中，您需要为某个区块或者某个元素添加一些事件，比如单击事件，同一个页面的事件会统一保存到对应的页面JS中。 很多时候您需要自定义一些方法去复用一些逻辑，也需要用到页面JS。 需要注意的是当前的页面JS只能使用声明函数，不能使用函数表达式声明函数，也不能在页面JS中定义其他的变量。
初始值类型：可选择“JSON类型”和“JS表达式类型” 初始值：数据写法和JS写法一致。 字符串: "string" 数字: 123 布尔值: true/false 对象: {"name": "xxx"} 数组: ["1", "2"] 空值: null JS表达式: (需要先选择JS表达式类型) 示例1：
输入工具类的名称，并编写函数代码。 function isNil(value) { return value == null } 图1 添加function工具类 单击“保存”，完成function工具类添加。 在JS面板的函数中使用function utils 您可以在JS面板或者页面生命周期函数中通过this
后将在JS面板中创建一个该名称的新方法。 扩展参数：调用当前事件传入的真实参数，数组格式，追加在原有事件参数之后如: onClickNew(eventArgs, extParam1, extParam2, ...)。 图1 设置绑定事件 单击“确定”，弹出JS面板。 在JS面板中进行绑定方法的具体逻辑实现。
在页面开发中，可能需要根据某些条件来动态显示或隐藏页面中的内容，例如：如果您希望当用户已经登录的时候，显示“欢迎登录”的文字，未登录的时候，显示“请登录”的文字。 Your browser does not support video tags. 参考登录AstroPro界面中操作，登录AstroPro界面。
选择页面类型：可选“静态页面”或“公共页面”。 页面名称：只允许包含英文字母，且以大写开头驼峰格式，如DemoPage。 选择文件夹：下拉框中选择文件夹名称。 路由：输入路由信息，只允许包含英文字母、数字、下划线、中划线和正斜杠组成， 且以英文字母开头。 单击“选择模板”，在右侧展开面板中选择模板。
在事件列表中，单击OnClick事件。 在弹框中输入方法名称，例如handleOnClick。 图1 事件绑定 单击“确定”，弹出JS面板。 在JS面板中编写代码。 代码示例： function handleOnClick(event) { this.loadingInstance
在应用服务列表中选择待操作的应用服务，单击“操作”列的“编辑”。 重新配置应用服务的基本信息。 应用服务名称：输入应用服务名称，名称仅允许以英文字母开头，包含英文字母和数字，一般采用驼峰格式或“-”连接，长度最低为两位。 描述：输入应用服务补充说明信息。 单击“确定”，完成应用服务编辑。 父主题：
如需更多可复制添加。 图1 默认组件 components都包含三个文件，一个index.js，一个*.vue文件和一个componentBundle.json文件，其中index.js 和 componentBundle.json这两个文件名字不可更改。 图2 components文件夹
一些npm包引用到工具类中，供后续调用，具体操作请参考使用工具类方法。 ：国际化插件，可添加国际化词条，实现中英文切换。 ：JS方法插件，您可以通过使用JS面板编写自己的代码，从而实现较为复杂的业务场景。 ：状态管理插件，可添加页面变量和添加全局变量，供页面及应用使用。 插件单击
设计前端应用流程 应用管理 页面管理 使用组件 属性设置 样式设置 高级设置 查看大纲树 数据源管理 使用工具类方法 国际化资源管理 使用JS面板 变量管理 生成业务代码 发布页面模板 使用模板创建页面 页面模板管理 物料中心
创建子域 使用说明 子域有助于将复杂的业务领域分解为更小、更易于管理和理解的部分。通过识别和创建子域，组织可以更有效地开发和维护应用，同时确保每个子域都能满足其特定的业务需求。 应用管理为Astro Pro企业版功能，如果您需要使用此功能，请升级Astro Pro产品版本。 创建子域
在下拉框中，分别选择应用服务所属的项目、应用和子域，单击“新增应用服务”。 配置应用服务基本信息。 应用服务名称：输入应用服务名称，名称仅允许以英文字母开头，包含英文字母和数字，一般采用驼峰格式或“-”连接，长度最低为两位。 描述：输入应用服务补充说明信息。 图1 新建应用服务 单击“确定”，完成应用服务创建。
可单击“下载自定义组件开发模板”，获取模板，并完成自定义组件开发，具体操作可参考自定义组件开发指南。 单击“点击上传”，上传本地已打包好的物料包。 上传的物料包名称不能与已有的物料包名称重复。 配置物料包基本信息。 表1 基本信息参数说明 参数 说明 物料包名称 自动识别物料包带入信息，无须手动填写。
选择页面类型：可选“静态页面”或“公共页面”。 页面名称：只允许包含英文字母，且以大写开头驼峰格式，如DemoPage。 选择文件夹：下拉框中选择文件夹名称。 路由：输入路由信息，只允许包含英文字母、数字、下划线、中划线和正斜杠组成， 且以英文字母开头。 图4 创建页面 单击“保存”。 在弹框中输入历史备份信息，单击“确定”。
选择业务对象模板 单击“下一步”。 添加服务依赖后，单击“创建”。 输入变更日志描述信息，单击“创建”。 系统开始创建服务，并生成该服务的代码。 图8 创建服务并生成代码包 父主题： 服务管理
选择项目和服务组，单击“新建服务”。 图2 新增一个服务 设置服务的基本信息。 图3 设置服务基本信息 服务名称：设置待添加服务的名称，由英文字母、数字或“-”组成，且必须以字母开头，一般采用驼峰格式，长度最低为两位。 服务类型：当前仅支持创建原子服务。原子服务是指对外提供业务对象
设置服务的基本信息，单击“确定”。 图2 设置服务基本信息 服务名称：设置待添加服务的名称，生成的服务代码压缩包和解压后的文件会以此命名。服务名称由英文字母、数字或“-”组成，且必须以字母开头，一般采用驼峰格式，长度最低为两位。 图3 代码压缩包名称 服务类型：当前仅支持创建原子服务。原子服
自定义DTO相当于数据传输对象，主要用于自定义API时添加参数或返回体。 操作步骤 在业务设计页面，单击“自定义DTO”。 图1 自定义DTO 单击，添加一个自定义DTO。 图2 自定义一个Dto1 在自定义API的参数或返回体中，使用自定义DTO。 从“business”中，拖拽“BO”对象至画布空白区域。
直接编写样式代码 使用状态选择器 行内绑定状态变量 高级配置管理 条件渲染 循环渲染 绑定事件 使用数据源 添加工具类 国际化资源管理 使用JS面板 添加变量 物料中心 自定义组件开发指南 上传自定义组件物料包 更新自定义组件物料包 下载自定义组件物料包 自定义组件开发指南 上传自定义组件物料包
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
