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

查看:1030
本文介绍了什么是“无状态功能组件不能给予参考”。意思?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有这个:

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)

我得到:

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

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.

推荐答案

在React中, refs 可能无法附加到无状态组件

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

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

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).

根据此GitHub评论,您可以放心地忽略该警告。

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

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

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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆