Ionic V5 在 Safari 上出现 Angular 组件问题
Ionic V5 with Angular component issue on Safari
我在 Ionic PWA 应用程序中遇到以下 UI 组件在 Safari 上的点击问题。
离子收音机
离子-select
离子菜单
当您单击单选按钮组件“https://ionicframework.com/docs/api/radio 1”时，您可以看到附加的屏幕截图，它实际上要求重新加载页面。
以下是版本详情：
MacOs：Catalina 10.15.7 (19H2)
Safari：版本 14.0（15610.1.28.1.9、15610）
Angular：9.1.6
离子：5.0.0
如有任何支持，我们将不胜感激。提前致谢。
这是最新的 Safari 和 ionic 5 的错误。
简短说明和解决方法：
问题出在 ion-item，只需在 ion-item 中添加 <div tabindex="0"></div> 即可解决问题。
详细说明（从下面的 github 问题复制）：
GitHub 问题：https://github.com/ionic-team/ionic-framework/issues/21939#issuecomment-694259307
发生了什么事？
在 Safari/iOS 测试版中出现回归，如果没有可聚焦的子元素，带有 delegatesFocus: true 的 Web 组件会导致浏览器崩溃。潜在的问题是 WebKit 在转发焦点之前没有检查可聚焦元素是否存在。这会影响 ion-item 组件，因为使用了 delegatesFocus: true。
问题已解决，修复问题的代码已合并；但是，该修复程序尚未在适用于 macOS 的 Safari 中发布。因此，当 macOS 的 Safari 14 发布时，这个问题仍然会出现。此修复已在 iOS 14 中发布，因此 运行 版本 iOS 的设备不受影响。
何时发布修复程序？
Ionic Framework 团队已确认该问题已在最新的 Safari 技术预览版中得到解决，表明此修复程序应该会在即将发布的 Safari 更新（即 Safari 14.0.1 或任何最终版本）中发布。修复发布后，我们将跟进此线程。
我在 Ionic PWA 应用程序中遇到以下 UI 组件在 Safari 上的点击问题。
离子收音机 离子-select 离子菜单 当您单击单选按钮组件“https://ionicframework.com/docs/api/radio 1”时，您可以看到附加的屏幕截图，它实际上要求重新加载页面。
以下是版本详情：
MacOs：Catalina 10.15.7 (19H2) Safari：版本 14.0（15610.1.28.1.9、15610） Angular：9.1.6 离子：5.0.0
如有任何支持，我们将不胜感激。提前致谢。
这是最新的 Safari 和 ionic 5 的错误。
简短说明和解决方法：
问题出在 ion-item，只需在 ion-item 中添加 <div tabindex="0"></div> 即可解决问题。
详细说明（从下面的 github 问题复制）： GitHub 问题：https://github.com/ionic-team/ionic-framework/issues/21939#issuecomment-694259307
发生了什么事？
在 Safari/iOS 测试版中出现回归，如果没有可聚焦的子元素，带有 delegatesFocus: true 的 Web 组件会导致浏览器崩溃。潜在的问题是 WebKit 在转发焦点之前没有检查可聚焦元素是否存在。这会影响 ion-item 组件，因为使用了 delegatesFocus: true。
问题已解决，修复问题的代码已合并；但是，该修复程序尚未在适用于 macOS 的 Safari 中发布。因此，当 macOS 的 Safari 14 发布时，这个问题仍然会出现。此修复已在 iOS 14 中发布，因此 运行 版本 iOS 的设备不受影响。
何时发布修复程序？
Ionic Framework 团队已确认该问题已在最新的 Safari 技术预览版中得到解决，表明此修复程序应该会在即将发布的 Safari 更新（即 Safari 14.0.1 或任何最终版本）中发布。修复发布后，我们将跟进此线程。