什么是“不能给无状态功能组件提供参考"?意思是? [英] What does "Stateless function components cannot be given refs" mean?

问题描述

我有这个:

const ProjectsSummaryLayout = ({projects}) =>{返回 (<div className="projects-summary col-md-10"><h3>项目</h3><ul>{projects.map(p => <li key={p.id}>{p.contract.client}</li>) }

)}const ProjectsSummary = 连接(状态 =>({项目:state.projects}))(ProjectsSummaryLayout)

我得到:

<块引用>

警告:不能为无状态函数组件提供参考(参见参考ProjectsSummaryLayout 中的wrappedInstance"由连接(ProjectsSummaryLayout)).尝试访问此参考将失败.

它想告诉我什么?我真的做错了什么吗?

我在这里看到了关于这个的讨论，但不幸的是我根本不明白结论.

解决方案

在 React 中，refs 不能附加到无状态组件.

React Redux 3 将 ref 附加到您提供给它的组件，无论它是否是无状态的.您看到的警告来自 React，因为在内部，React Redux 3 将 ref 附加到您提供的无状态组件 (ProjectsSummaryLayout).

您没有做错任何事情，根据此 GitHub 评论，您可以放心地忽略警告.

在 React Redux 4 中，默认情况下没有 ref 附加到包装的组件，这意味着如果您升级到 React Redux 4，警告应该会消失.

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.

What is it trying to tell me? Am I actually doing something wrong?

I see discussion about this here but unfortunately I simply don't understand the conclusion.

解决方案

In React, refs may not be attached to a stateless component.

React Redux 3 attaches a ref to the component you give it regardless of whether or not it's stateless. The warning you see comes from React because internally, React Redux 3 attaches a ref to the stateless component you supplied (ProjectsSummaryLayout).

You're not doing anything wrong and according to this GitHub comment, you can safely ignore the warning.

In React Redux 4, no ref is attached to the wrapped component by default, which means if you upgrade to React Redux 4, the warning should go away.

这篇关于什么是“不能给无状态功能组件提供参考"?意思是?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！