如何解决有角度的闪烁图标
我用 Angular 11 和 bootstrap 以及 bootstrap-icons 实现了一个简单的按钮。 当我路由显示按钮的页面时,该按钮会立即加载。但只有当大约 500 毫秒过去时,图标才会弹出并且看起来像是在闪烁。
我怎样才能摆脱这种行为?列表视图等中的图标也会出现这种情况。
<button
type="button"
class="btn btn-secondary float-right w-25 mb-3"
>
<svg width="24" height="24">
<use xlink:href="assets/bootstrap-icons/bootstrap-icons.svg#plus" />
</svg>
Test
</button>
解决方法
您可以使用以下 npm
命令将引导程序图标直接安装到您的 angular 项目中。
npm i bootstrap-icons
然后使用图标如下。 (例如:+
图标)
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-plus" viewBox="0 0 16 16">
<path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z"/>
</svg>
这将消除闪烁行为。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。