Menu
Could somebody tell me what's the difference between
React.findDOMNode(this.refs.email).value and
this.refs.email.getDOMNode().value They are doing the same thing - getting the value of element, but where should I use which one.
881
findDOMNode is an escape hatch used to access the underlying DOM node. In most cases, use of this escape hatch is discouraged because it pierces the component abstraction. It has been deprecated in StrictMode .
What is the difference? The react package holds the react source for components, state, props and all the code that is react. The react-dom package as the name implies is the glue between React and the DOM. Often, you will only use it for one single thing: mounting your application to the index.
The renderComponent is a must API for every React. js component.
ReactDOM is a package that provides DOM specific methods that can be used at the top level of a web app to enable an efficient way of managing DOM elements of the web page.
component.getDOMNode() is deprecated as of React 0.13:
Added new top-level API
React.findDOMNode(component), which should be used in place ofcomponent.getDOMNode(). The base class for ES6-based components will not havegetDOMNode. This change will enable some more patterns moving forward.
via http://facebook.github.io/react/blog/2015/03/10/react-v0.13.html#new-features
It will likely be removed in a future version of React (but don't quote me on that, because I can't find a good reference).
getDOMNode() throws a warning in 0.13 and 0.14, and it will be removed completely in 0.15:
With each returned DOM node, we've added a
getDOMNodemethod for backwards compatibility that will work with a warning until 0.15.
via https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html#new-deprecations-introduced-with-a-warning
Also note that calling findDOMNode or getDOMNode is no longer necessary for React DOM components as of 0.14:
The other big change we’re making in this release is exposing refs to DOM components as the DOM node itself. That means: we looked at what you can do with a ref to a React DOM component and realized that the only useful thing you can do with it is call
this.refs.giraffe.getDOMNode()to get the underlying DOM node. Starting with this release,this.refs.giraffeis the actual DOM node. Note that refs to custom (user-defined) components work exactly as before; only the built-in DOM components are affected by this change.
via https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html#dom-node-refs
Relevant code and commits from the React repo on GitHub:
114
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
