使用 React 的 Azure DevOps 扩展：无法停止导航离开页面（beforeunload 事件）答案

【问题标题】：Azure DevOps extension using React: Can't stop navigating away from the page(beforeunload event)使用 React 的 Azure DevOps 扩展：无法停止导航离开页面（beforeunload 事件）
【发布时间】：2020-11-23 01:53:34
【问题描述】：

azure-devops-extension-sdk 具有可以监听 onLoaded、onRefreshed、onUnloaded 等工作项的事件。但是当网页本身被刷新（导航离开）时，没有事件可以监听。如果我的自定义 UI 元素中有未保存的更改，我需要停止导航操作。 Azure DevOps 仅在使用标准后端字段的情况下固有地执行此操作。我的自定义 UI 元素（使用我开发的扩展程序安装）不使用任何后端字段。

window.addEventListener 函数似乎不起作用，window.beforeunload 函数也不起作用。

【问题讨论】：

标签： azure-devops azure-devops-extensions

【解决方案1】：

您似乎正在使用集线器扩展。我们无法使用浏览器的 window.beforeunload 事件，该事件在扩展的情况下不起作用，因为它在 iframe 中运行。

经过azure-devops-extension-api后，没有找到相关接口。恐怕这现在不适用于自定义扩展。

【讨论】：

我正在创建一个控件类型的扩展，它将被添加到现有的工作项中。我认为 onUnloaded 事件也会处理导航场景。但似乎并非如此。您可以建议任何解决方法吗？
不怕。您可以提交用户声音。 developercommunity.visualstudio.com/spaces/21/…给您带来的不便，敬请见谅。
已有其他用户提交了功能请求。我会等待对此的答复。同时，我通过结合使用后端字段和 setError 函数找到了一种解决方法。不是很好的用户体验，但现在可以完成工作。
@SaleelAli 感谢您的热情回复。您也可以在此处分享您的解决方案并将其标记为回复。这也将帮助社区中的其他人。