检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
图41 事件配置 在“添加动作”页面，选择“自定义动作”，输入自定义JS代码，单击“创建”。 如下JS代码仅为示例，请根据实际情况修改示例中表单名称（form_0）和字段名称（data.name）。更多自定义JS脚本介绍，请参见如何通过JS代码，实现页面与后台接口间的交互。
图1 自定义JS代码 解决方法 “onOK”是系统预置事件，不提供阻止窗口关闭的能力。对于类似需求，可以通过将“footerHide”属性设为“true”，来屏蔽弹窗中的预置功能按钮，改为弹窗引用业务页面自己的相应功能按钮，并在按钮事件中实现所需校验、提示、关闭等处理逻辑。
对于自定义组件的开发和调试，AstroZero提供Scaffolding脚手架工具，可实现本地开发组件的实时在线调测。对于前台页面中常遇到的样式或功能问题，可借助浏览器内置的开发者工具来对问题进行调试和定位。
在BridgeTestWidget.js文件中，定义桥接器处理逻辑。 组件中，常用桥接器的相关API，如表1所示。完整的BridgeTestWidget.js配置示例如下。
修改解压后的“Navigator_Widget.js”文件。 “Navigator_Widget.js”文件是Widget逻辑文件，整个Widget的渲染核心JS。
事件：事件编排器的入口，通过系统预置的事件编排器，或者直接定义JS代码，来实现页面组件与后台接口之间的交互。 库：加载当前页面所依赖库的入口。页面设计的某些功能需要依赖特定的库来完成，用户可以在该页签下新增或删除某些库。
单击“点击”后的“+”，在“添加动作”弹窗中，输入以下自定义JS代码。
在上传组件的事件编排JS代码中，可使用该方法，示例JS代码如下： var _component = context.$component.get('upload_0');_component.clearFiles(); 父主题： 平台标准组件介绍
如何下载组件模板，请参见管理组件模板 图5 事件、动作组件模板 组件模板中包含多种功能的示例组件，可以参考组件模板开发自定义组件，组件模板的下载及说明请参见在线开发华为云Astro轻应用高级页面自定义组件。
在华为云Astro轻应用中自定义高级页面组件（widget）时，修改了JS文件，修改部分不生效？ 配置高级页面组件桥接器实例属性时，如何设置下拉框中的选项值？ 在华为云Astro轻应用高级页面中，如何实现所有组件都加载完成后，再执行某段逻辑？
自定义校验：是否进行自定义校验，打开后需要设置校验JS代码。当输入框在表单组件中，该设置才会生效。 校验方法：输入JS代码定义校验规则，代码的返回值必须为布尔类型或者对象类型。
如下加粗代码所示，“widget_demo_property.editor.js”中分别定义了text、 checkbox以及select类型的三个属性参数。
修改解压后的“Vue3Navigator_Widget.js”文件。 “Vue3Navigator_Widget.js”文件是Widget逻辑文件，整个Widget的渲染核心JS。
表1 请求消息头 消息头名称 描述 是否必选 Content-Type HTTP协议中设定的一个参数，用于标识返回的内容用什么格式去解析，此处必须配置为“application/json”。表示浏览器将返回内容解析为json对象。
表4 组件列表中功能按钮说明 按钮 名称 功能 组件编辑 用于打开“组件编辑”页面，通过在线编辑器开发组件。
启用js编译器 当打包应用内有高级页面时，才会显示该参数。开启后，会将高级页面引用的插件和资源进行JS编译，使代码规范化。 高级设置 > 导航栏显示方式 在小程序中展示时，是否显示导航栏。 在OneMobile小程序容器管理后台，发布小程序。
自定义校验：是否进行自定义校验，打开后需要设置校验JS代码。当输入框在表单组件中，该设置才会生效。 校验方法：输入JS代码定义校验规则，代码的返回值必须为布尔类型或者对象类型。
op.submitInstance(variables)) 提交任务： $bpm(op => op.submitTask(variables)) 更改变量： $bpm(op => op.putVariables(variables)) 图3 在高级页面组件的事件中与BPM交互 另外，在高级页面的自定义组件的JS
图10 为列表视图添加事件 图11 输入自定义JS代码 const list = []; for (let i = 0; i < 5; i++) { list.push({ value: i + 1 }) } context.
还可以将该组件属性值“隐藏”配置为布尔类型模型字段，在自定义JS代码中来控制模型字段取值，从而设置该组件是否隐藏，这种动态设置优先级是最高的。 样式 布局：设置组件的宽度、高度等。
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
