"无状态功能组件不能给出参考"是什么意思?

Gre*_*ade 40 javascript reactjs redux react-redux

我有这个:

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)
Run Code Online (Sandbox Code Playgroud)

我得到:

警告:无法为无状态函数组件提供refs(请参阅Connect(ProjectsSummaryLayout)创建的ProjectsSummaryLayout中的ref"wrappedInstance").尝试访问此参考将失败.

它试图告诉我什么?我实际上做错了吗?

在这里看到关于这个的讨论,但不幸的是我根本不理解结论.

Ale*_*ker 28

在React中,refs可能不会附加到无状态组件.

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

你没有做错任何事情,根据这个GitHub评论,你可以放心地忽略警告.

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