我假设是虚拟 DOM，并且 React 会通过 diff'ing 来处理它。但是我有一个招聘人员说 ref 会影响实际的 DOM，我看不出这是怎么回事。我认为他们只是弄错了。

我是新来的反应。我无法弄清楚如何使这项工作。

这 [参考组件]

给我错误

与组件一起返回时

在某些条件下在此函数内

当我直接使用它[没有任何条件渲染，即直接在 render() 内部]时，它只会运行而没有任何错误。我假设有一些这个范围错误，但我不知道如何解决这个问题。我认为render(return(//here))内部的这个范围和function(){return(//here)}内部的这个范围是不同的。

当我尝试以下面的方式使用它时，它没有给出任何错误，但是在每次更改输入时，我的输入焦点都消失了。但是当在里面使用它时，render(return(//directly here with component))它工作得非常好。

我不清楚 ref 实际需要什么。我阅读了文档，但我不知道如何在这种情况下使用它。我使用 antd 作为组件库，我认为这与此错误无关。

我希望我已经正确地提出了我的问题。这个你能帮我吗。

下面是我正在运行的整个代码。

即使成功设置了 List ref（如 tree.js 示例中所示），我似乎也无法使用公共方法成功触发重新测量行高（也显示在 tree.js 示例中）。

https://plnkr.co/edit/V2JhJL8ZGknrbYgRWDhf?p=preview

我在 Stackoverflow 上读过一篇关于 refs 的问题

我们可以使用类似下面的代码将一个 ref 数组分配给不同的输入，如下所示：

但是当我尝试它时，它会返回此错误：

它不起作用，我错过了什么吗？

我正在尝试获取无状态子组件的高度，以便能够在父类中使用它的高度，但出现以下错误：Invariant Violation: Stateless function components cannot have refs.

简化代码

家长班

孩子

有没有办法做到这一点？

这是带有错误的 Codepen的链接。

更新：

实际代码/上下文

所以我目前有一个 Header 组件，它看起来像这样：

在某些情况下，我想向此 Header 添加逻辑以对其进行动画处理（例如，在用户滚动时的主页上，我正在为 Header 设置动画以在他们滚动经过某个点时变为固定 - 如果您愿意的话，这是一个粘性标题）。

我之前这样做的方法是只为具有特定功能（如上所述）和没有特定功能的标头创建一个单独的类。但是为了保持我的代码干燥，我已经将 Header 分离为它自己的功能性无状态组件，以便将其包装在 Class 中，从而为其提供粘性标题功能。

这是该类：

所以这就是这个特定问题的背景——我希望这能让事情更清楚一点。

Ps 抱歉缺少上下文，我想答案会比看起来更直接！

我正在创建一个 ExtJS 5.1.1 演示应用程序。尝试给gridpanel一个刷新按钮refs，这样我就可以设置一个函数来重新加载网格内的数据。

我想我无法refs为网格面板和刷新按钮创建正确的。因此点击事件不起作用。

主视图：

网格面板：

控制器：

我有一个类组件，它有一个onClick引用内部 ref 的事件处理程序input。但是，在事件处理程序input中为空。我将事件处理程序绑定到this构造函数中。

为什么this.input在我的事件处理程序中未定义？

编辑 显然代码运行良好，只是不在我的环境中。我将webpack和babel与 env 一起使用，并对带有热重新加载的预设做出反应。我的目标是电子。

完整的错误堆栈：

编辑

想通了，请参阅下面的答案。

我想我误解了裁判应该如何工作。在一个组件中，我返回：

return <canvas ... ref={(ref) => this._canvas = ref}/>

后来，在 中componentDidMount，我尝试访问 ref：

this._canvas.getContext('2d')

错误是因为this._canvas引用了某种构造函数，如下所示：

我的问题是：

1. 保存对实际画布元素的引用的最佳方法是什么，以便我以后可以做类似getContext的事情，以及
2. 构造函数到底是什么，它的目的是什么？

我注意到调用this._canvas.getDOMNode()返回实际元素，这似乎是我正在寻找的。this._canvas但是，在不完全理解我在做什么的情况下，我宁愿不通过并替换所有引用。

我正在尝试对其进行设置，以便在滚动从数组映射的图像时，使用该图像的坐标更新状态，从而更新谷歌地图。

通过阅读其他一些问题，我设置了以下生命周期方法：

但是，ReactDOM.findDOMNode(this.refs.img)总是返回undefined

什么是我可以打电话的方式

并在滚动特定图像时更新地图？

我正在尝试访问 this.refs 以便可以滚动到平面列表的顶部，但它是未定义的。

我的渲染方法是这样的：

如您所见，我将 ref 设置为“flatList”。

然后我有一个选项卡栏，当您单击其中一个选项卡时，它会滚动到列表顶部。（我只是为了不控制台注销 this.refs 但未定义）

我需要做些什么不同的事情才能使 this.refs 在 onTabBarPress 函数中不被未定义？