屏蔽和阻止生命周期事件

仅适用于移动应用程序和响应式 Web 应用程序

在 OutSystems 移动和响应式 Web 应用程序中，屏幕和块遵循由一组阶段组成的生命周期。其中一些阶段是当您打开应用程序并进入默认屏幕、导航到另一个屏幕或更改屏幕或块的数据时。

屏幕或块的数据如下：

• 输入参数
• 变量
• 聚合和数据操作
• 验证消息

在实施移动或响应式 Web 应用程序时，开发人员可以通过使用一组事件处理程序操作来对这些阶段进行操作。这些事件处理程序使开发人员能够了解屏幕和块的生命周期，并有机会在某些事件发生时实施逻辑。

您可以在屏幕和块的属性编辑器的事件部分中查看和定义事件处理程序，或者在聚合或数据操作的属性编辑器中查看和定义数据完成获取时触发的事件处理程序。

生命周期阶段

首次打开应用程序

在屏幕之间导航

从一个屏幕导航到另一个屏幕是一种非常常见的应用程序模式。这通常由用户交互触发，例如单击屏幕上的按钮或列表项。在 OutSystems 中的屏幕之间导航意味着加载一个新屏幕，然后删除前一个屏幕。

当导航开始时，目标屏幕的 DOM 会立即开始加载。这意味着要删除的屏幕的 DOM 和目标屏幕同时存在。旧屏幕的 DOM 仅在目标屏幕的 Render 事件后才被移除，确保屏幕之间快速平滑的过渡，避免向用户显示目标屏幕的加载阶段。

第一个运行的事件处理程序是On Initialize。应用程序继续加载目标屏幕的 DOM，然后加载其事件，如应用程序打开时部分中所述。由于这些事件属于目标屏幕，活动屏幕是目标屏幕，active-screenDOM 中的类被分配给该屏幕的元素。

在目标屏幕的Render事件之后，屏幕之间发生转换，旧屏幕最终从 DOM 中移除。这意味着两个屏幕的 DOM 在目标屏幕的 Render 事件和旧屏幕的 Destroy 事件之间可用

关于更改屏幕或块的数据

每次更改屏幕或块的数据元素的值时，应用程序都会自动对其做出反应。因此，Render 事件被触发，依赖于数据的 UI 元素自动更新。您不必像为 Web 应用程序那样显式刷新 UI 元素。

对于屏幕或块聚合和数据操作，它们的新值会在 UI 元素中自动更新，但您需要明确地重新运行查询。这可以使用逻辑中的刷新数据流元素来完成。

数据获取完成后，After Fetch事件发生，由于Aggregate 或Data Action 返回的数据属于屏幕或块数据，发生了变化，因此也会发生Render 事件。

例如，想象一个屏幕显示联系人的详细信息以及对该联系人的呼叫列表。要获得呼叫，您可以使用一个聚合，该聚合由分配有当前联系人标识符的屏幕变量值过滤。当联系人更改时，屏幕将显示新的联系人详细信息，因此修改屏幕变量以包含新的联系人标识符。要获取此新联系人的呼叫列表，聚合必须再次运行。为此，您只需在逻辑中调用刷新数据流元素并选择相应的聚合或数据操作。当查询返回新的呼叫列表时，屏幕中的列表会自动更新。

关于更改块的参数

为了在其中一个输入参数更改时允许通知和更新块，应用程序运行块的Parameters Changed事件处理程序。此事件处理程序的一个常见用例是重新运行某些取决于输入参数的聚合或数据操作，如上图所示，在日历日期更改后，再次执行查询以获得图表的新值.

由于输入参数是Block数据的一部分，因此也会触发Render事件，但只是在Parameters Changed事件之后。

初始化时

On Initialize 事件处理程序在检查用户访问屏幕的权限之后执行，但在导航到屏幕并开始获取数据之前执行。

在块中，在此流程中包含任何服务器操作调用或本地存储操作可能会导致块的呈现在此操作完成之前开始。如果您在此流程中设置任何影响渲染的变量，您将遇到问题。

笔记：

• 保持此事件处理程序操作简单并避免诸如本地存储操作之类的缓慢操作，因为它可能会延迟屏幕或块的呈现。
• 避免访问屏幕或块的数据，因为此操作在获取数据之前运行。

您可以使用此事件处理程序实现的用例：

• 根据输入分配变量。
• 根据 JavaScript 中的某些计算分配变量，例如随机数。
• 如果用户无权查看屏幕，则将应用程序重定向到另一个屏幕（仅当事件处理程序属于屏幕时才有可能）。
• 根据屏幕的输入分配子块的参数。
• 访问 JavaScript 窗口对象的变量。

就绪

On Ready 事件处理程序在 Screen 或 Block 准备就绪时运行，即当 DOM 准备就绪时，在第一次渲染之后。在块中，此事件发生在父屏幕或块的同一事件之前。为了确保快速流畅的屏幕或块渲染，甚至在过渡到屏幕结束之前就会触发此事件。

笔记：

• 触发此事件时，将加载上一个和当前屏幕的 DOM。为确保您在正在创建的屏幕上进行操作，请仅对具有divclass 的 HTML 元素执行逻辑active-screen。
• 保持此事件处理程序操作简单，并避免使用并行运行的屏幕聚合或数据操作来操作可能不可用的数据。
• 避免访问屏幕或块的数据，因为此操作在获取数据之前运行。如果您需要针对这些数据开发一些逻辑，请使用相应聚合或数据操作的 On After Fetch 事件处理程序。

您可以使用此事件处理程序实现的用例：

• 初始化需要 DOM 的第三方组件。
• 将侦听器添加到 DOM 元素。
• 将焦点设置在输入小部件上。
• 将侦听器添加到 JavaScript 窗口对象。

渲染时

On Render 事件处理程序在每次渲染屏幕或块后运行，即每当屏幕或块打开时（在 On Ready 事件处理程序执行之后）以及屏幕数据发生任何更改后。在块中，此事件发生在父屏幕或块的同一事件之前。您可以使用此事件处理程序来更新第三方组件，例如进度条。

笔记：

• 避免更改 Screen 或 Block 数据，因为每次此数据更改时都会再次触发 On Render 事件，并且应用程序可能会在无限循环中运行。
• 保持此事件处理程序操作简单并避免服务器请求等缓慢操作，因为它可能会延迟屏幕或块的呈现。
• 在屏幕或块的第一次呈现时，避免访问屏幕或块的数据，因为不能保证数据已经被获取。如果您需要针对这些数据开发一些逻辑，请使用相应聚合或数据操作的 On After Fetch 事件处理程序。

您可以使用此事件处理程序实现的用例：

• 根据 Screen 或 Block 的数据变化来更新第三方组件。
• 与 On Ready 事件处理程序相同的用例。

在获取后

On After Fetch 事件处理程序在聚合或数据操作完成获取数据后立即执行。由于每个聚合或数据操作都有自己的 On After Fetch 事件处理程序，您可以实施逻辑来对从该数据源检索到的数据进行操作。

笔记：

• 当 On After Fetch 事件处理程序运行时，数据已到达并可用，但未绑定到小部件。这意味着小部件尚未更新。

您可以使用此事件处理程序实现的用例：

• 将查询返回的第一条或最后一条记录分配给变量。
• 在主从模式中，迭代查询以填充列表列表。
• 对于依赖于其他查询的查询，您可以使用此事件处理程序来触发依赖的聚合。

不应使用此事件处理程序实现的用例：

• 此时不要使用 GetUserId() 函数来了解当前已通过身份验证的用户。屏幕中数据操作和客户端聚合的并行执行会覆盖会话身份验证 cookie。因此，在 On After Fetch 事件中使用 GetUserId() 函数可能会返回一个空值。

参数改变

On Parameters Changed 是仅针对在父屏幕或块更改块的输入后运行的块的事件处理程序。如果您在另一个块中有一个块，并且外部块的输入更改会影响嵌套块的输入，则外部块的 On Parameters Changed 事件处理程序在嵌套块的相同事件之前运行。您可以使用此事件处理程序使块适应输入参数更改，例如更新变量或重新运行聚合和数据操作。

您可以使用此事件处理程序实现的用例：

• 刷新依赖于该输入参数的聚合或数据操作。
• 重新计算依赖于输入参数的变量。

销毁时

On Destroy 事件处理程序在 Screen 或 Block 将要被销毁时执行。在 Screens 中，当到新 Screen 的转换结束时会发生此事件。在块中，此事件发生在块从 DOM 中删除之前。此事件按照自上而下的顺序触发：如果您有一个带有嵌套块的屏幕，则该事件首先在屏幕中发生，然后在外部块中发生，然后在嵌套块中发生。您可以使用此事件处理程序来实现逻辑以删除屏幕或块的任何足迹，例如删除事件侦听器。

笔记：

• 触发此事件时加载当前屏幕和目标屏幕的 DOM。为确保您在被销毁的屏幕上进行操作，请仅对具有divclass 的 HTML 元素执行逻辑active-screen。
• 保持此事件处理程序操作简单并避免服务器请求等缓慢操作，因为它可能会延迟屏幕或块的移除，以及在退出屏幕的情况下加载下一个屏幕。

您可以使用此事件处理程序实现的用例：

• 调用第三方组件的销毁动作。
• 清理 DOM 以再次运行插件。
• 删除 JavaScript 侦听器。