问题描述
我想在Next.js项目中包含一些真棒字体"图标.我已经添加了所需的
I want to include some Font-Awesome Icons in my Next.js project. I've added the needed
<script src="https://kit.fontawesome.com/xxxxxxxx.js" crossorigin="anonymous"></script>
先标记我的头,然后
<i className="fas fa-arrow-right"></i>
标记到我的渲染方法.如果我在浏览器中打开网站,则会向我发出以下控制台警告:
tag to my render method.If I open the website in my browser it gives me this console warning:
和
<i className="fas fa-arrow-right"></i>
切换到
<i className="fas fa-arrow-right" aria-hidden="true"></i>
我已经尝试过react-fontawesome软件包,但似乎不适用于SSR.添加
I've already tried the react-fontawesome package but that doesn't seem to work with SSR. Adding
aria-hidden="false"
手动也没有修复它.
我想这是SSR的问题,但我找不到合适的解决方案或替代方案.
I guess this is a problem with SSR but I wasn't able to find a good solution or alternative for it.
推荐答案
我遇到了同样的问题,并通过向图标添加 aria-hidden
来解决此问题:
I had the same issue and I resolved by adding aria-hidden
to the icon in this way:
<i aria-hidden className="fab fa-whatsapp" />
没有更多警告.
这篇关于Font-Awesome添加了aria-hidden属性,可防止图标出现在浏览器中[SSR]的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!