angular 5禁用移动设备上的cdk焦点状态

发布时间：2020-12-17 18:11:17 所属栏目：安全来源：网络整理

导读：在移动设备上有一个错误(我猜),当您单击侧面导航菜单然后选择要转到的路线时,它会关闭sidenav,但会使菜单按钮处于焦点状态.也可以使用打开模态的按钮,或实际上具有焦点状态的任何东西(侧面导航,导航项,按钮等等). 你可以看到它发生在角度材料侧导航示例(模拟

在移动设备上有一个错误(我猜),当您单击侧面导航菜单然后选择要转到的路线时,它会关闭sidenav,但会使菜单按钮处于焦点状态.也可以使用打开模态的按钮,或实际上具有焦点状态的任何东西(侧面导航,导航项,按钮等等).

你可以看到它发生在角度材料侧导航示例(模拟移动设备)：
https://stackblitz.com/angular/brrokxxmqvrn?file=app%2Fsidenav-autosize-example.ts

或者您可以看到下面的屏幕截图(切换侧边按钮在我点击之后被聚焦)

enter image description here

我想知道如何在角度5上禁用移动(或在某些条件下)的cdk焦点状态

解决方法

我最终做的删除效果是使用以下css：

.mat-button,.mat-icon-button {
  &.cdk-focused,&.cdk-program-focused {
    background-color: none !important;

    .mat-button-focus-overlay {
      display: none !important;
    }
  }
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!