[英]FontAwesome react-native warnings
i am trying to use fontawesome
in react-native-web-app
我正在尝试在
react-native-web-app
中使用fontawesome
Did everything as suggested in docs, but for some reason getting this warning in console.按照文档中的建议做了所有事情,但由于某种原因在控制台中收到此警告。
<FontAwesomeIcon icon={faSearch} style={[styles.icon]} />
- this is the part which triggers all warnings. <FontAwesomeIcon icon={faSearch} style={[styles.icon]} />
- 这是触发所有警告的部分。 If I will remove it, warning are gone too.如果我将其删除,警告也将消失。
Warnings:警告:
Warning: React does not recognize the
secondaryFill
prop on a DOM element.警告:React 无法识别 DOM 元素上的
secondaryFill
道具。 If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercasesecondaryfill
instead.如果您有意希望它作为自定义属性出现在 DOM 中,请将其拼写为小写的
secondaryfill
。 If you accidentally passed it from a parent component, remove it from the DOM element.如果您不小心从父组件传递了它,请将其从 DOM 元素中移除。
Warning: React does not recognize the
secondaryOpacity
prop on a DOM element.警告:React 无法识别 DOM 元素上的
secondaryOpacity
道具。 If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercasesecondaryopacity
instead.如果您有意希望它作为自定义属性出现在 DOM 中,请将其拼写为小写的
secondaryopacity
。 If you accidentally passed it from a parent component, remove it from the DOM element.如果您不小心从父组件传递了它,请将其从 DOM 元素中移除。
Warning: findDOMNode is deprecated in StrictMode.
警告:findDOMNode 在 StrictMode 中已弃用。 findDOMNode was passed an instance of Path which is inside StrictMode.
findDOMNode 被传递给 StrictMode 中的 Path 实例。 Instead, add a ref directly to the element you want to reference.
相反,将 ref 直接添加到您要引用的元素。 Learn more about using refs safely here: https://reactjs.org/link/strict-mode-find-node
在此处了解有关安全使用 refs 的更多信息: https://reactjs.org/link/strict-mode-find-node
Warning: findDOMNode is deprecated in StrictMode.
警告:findDOMNode 在 StrictMode 中已弃用。 findDOMNode was passed an instance of Svg which is inside StrictMode.
findDOMNode 被传递给 StrictMode 中的 Svg 实例。 Instead, add a ref directly to the element you want to reference.
相反,将 ref 直接添加到您要引用的元素。 Learn more about using refs safely here: https://reactjs.org/link/strict-mode-find-node
在此处了解有关安全使用 refs 的更多信息: https://reactjs.org/link/strict-mode-find-node
It looks like this is a known issue with an open pull request in the library:https://github.com/FortAwesome/react-native-fontawesome/pull/74看起来这是库中打开拉取请求的已知问题:https://github.com/FortAwesome/react-native-fontawesome/pull/74
For now, the last comment in that thread offers a workaround .目前,该线程中的最后一条评论提供了一种解决方法。 You can use @fortawesome/react-fontawesome for web, and
react-native-fontawesome
for Android/iOS. web 可以使用@fortawesome/react-fontawesome ,Android/iOS 可以使用
react-native-fontawesome
。
Copying their code snippet here:在这里复制他们的代码片段:
import {FontAwesomeIcon as FontAwesomeReact} from '@fortawesome/react-fontawesome';
import {FontAwesomeIcon as FontAwesomeNative} from '@fortawesome/react-native-fontawesome';
import {number} from 'prop-types';
import React from 'react';
import {Platform, StyleSheet} from 'react-native';
FaIcon.propTypes = {
size: number,
};
export default function FaIcon({size, style, ...props}) {
if (Platform.OS === 'web') {
const webStyles = StyleSheet.flatten([style, {width: size, height: size}]);
return <FontAwesomeReact {...props} style={webStyles} />;
}
return <FontAwesomeNative {...props} size={size} style={style} />;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.