Javascript “不能给无状态功能组件提供参考”是什么意思？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/35952607/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What does "Stateless function components cannot be given refs" mean?
提问by GreenAsJade
I have this:
我有这个：
const ProjectsSummaryLayout = ({projects}) => {
return (
<div className="projects-summary col-md-10">
<h3>Projects</h3>
<ul>
{ projects.map(p => <li key={p.id}>{p.contract.client}</li>) }
</ul>
</div>
)
}
const ProjectsSummary = connect(
state => ({projects: state.projects})
)(ProjectsSummaryLayout)
and I get:
我得到：
Warning: Stateless function components cannot be given refs (See ref "wrappedInstance" in ProjectsSummaryLayout created by Connect(ProjectsSummaryLayout)). Attempts to access this ref will fail.
警告：不能为无状态功能组件提供参考（请参阅由 Connect(ProjectsSummaryLayout) 创建的 ProjectsSummaryLayout 中的参考“wrappedInstance”）。尝试访问此引用将失败。
What is it trying to tell me? Am I actually doing something wrong?
它想告诉我什么？我真的做错了什么吗？
I see discussion about this herebut unfortunately I simply don't understand the conclusion.
我在这里看到了关于这个的讨论，但不幸的是我根本不明白这个结论。
采纳答案by Alex Booker
In React, refsmay not be attached to a stateless component.
在 React 中，refs可能不会附加到无状态组件。
React Redux 3attaches a refto the component you give it regardlessof whether or not it's stateless. The warning you see comes from React because internally, React Redux 3 attaches a refto the stateless component you supplied (ProjectsSummaryLayout).
React Redux 3将 a 附加ref到您提供给它的组件，无论它是否是无状态的。您看到的警告来自 React，因为在内部，React Redux 3 将 a 附加ref到您提供的无状态组件 ( ProjectsSummaryLayout)。
You're not doing anything wrong and according to this GitHub comment, you can safely ignore the warning.
您没有做错任何事情，根据此 GitHub 评论，您可以放心地忽略警告。
In React Redux 4, no refis attached to the wrapped component by default, which means if you upgrade to React Redux 4, the warning should go away.
在 React Redux 4 中，ref默认情况下没有附加到包装的组件，这意味着如果您升级到 React Redux 4，警告应该消失。
回答by Divyanshu Rawat
React has 2 commonly used component styles.
React 有 2 种常用的组件样式。
- Functional Component
- Class Component
- 功能组件
- 类组件
So, When I was making use of Functional one then I was encountering this error.
所以，当我使用 Functional 时，我遇到了这个错误。
Code snippet corresponding to Functional Component
功能组件对应的代码片段
But as soon as I changed it to Class Component then it worked.
但是一旦我将其更改为类组件，它就起作用了。
Code snippet corresponding to Class Component.
类组件对应的代码片段。
Try changing Functional Component to Class Component. I hope it will resolve your problem.
尝试将功能组件更改为类组件。我希望它能解决你的问题。
