javascript – “无状态函数组件不能给refs”是什么意思？

我有这个：

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)

我得到：

Warning: Stateless function components cannot be given refs (See ref
“wrappedInstance” in ProjectsSummaryLayout created by
Connect(ProjectsSummaryLayout)). Attempts to access this ref will
fail.

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

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

解决方法:

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

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

你没有做错任何事,根据this GitHub comment,你可以放心地忽略警告.

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

标签：javascript,reactjs,redux,react-redux
来源： https://codeday.me/bug/20190930/1836728.html