React.js:findDOMNode 和 getDOMNode 的区别

IT技术 reactjs
2021-05-13 08:36:40

有人能告诉我两者有什么区别吗

React.findDOMNode(this.refs.email).value

this.refs.email.getDOMNode().value

他们正在做同样的事情 - 获取元素的值,但我应该在哪里使用哪个。

2个回答

component.getDOMNode() 从 React 0.13 开始弃用:

添加了新的顶级 API React.findDOMNode(component),应代替component.getDOMNode(). 基于 ES6 的组件的基类不会有getDOMNode. 这一变化将使更多的模式向前发展。

通过http://facebook.github.io/react/blog/2015/03/10/react-v0.13.html#new-features

它可能会在 React 的未来版本中被删除(但不要引用我的话,因为我找不到好的参考)。


编辑:更新以反映 React 0.14

getDOMNode() 在 0.13 和 0.14 中抛出警告,并在 0.15 中完全删除:

对于每个返回的 DOM 节点,我们添加了getDOMNode一种向后兼容方法,方法将在 0.15 之前发出警告。

通过https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html#new-deprecations-introduced-with-a-warning

另请注意,从 0.14 开始,React DOM 组件不再需要调用findDOMNodeor getDOMNode

我们在此版本中进行的另一个重大更改是将 DOM 组件的 refs 作为 DOM 节点本身公开。这意味着:我们研究了使用 React DOM 组件的 ref 可以做什么,并意识到你可以用它做的唯一有用的事情是调用this.refs.giraffe.getDOMNode()获取底层 DOM 节点。从此版本开始,this.refs.giraffe 实际的 DOM 节点。请注意,对自定义(用户定义)组件的引用与以前完全一样;只有内置 DOM 组件会受到此更改的影响。

通过https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html#dom-node-refs


来自 GitHub 上 React 存储库的相关代码和提交:

第二个是用于访问 refs DOM 节点的旧 API,第一个是新方式。因此,如果您使用的是最新版本的 React,则应该使用第一个。