Note that ref callbacks can update during render and be called after mount.

This commit is contained in:
Kenneth Powers
2017-10-27 22:36:39 -04:00
parent efe928284a
commit 18097a25eb

View File

@@ -66,7 +66,7 @@ class CustomTextInput extends React.Component {
}
```
React will call the `ref` callback with the DOM element when the component mounts, and call it with `null` when it unmounts. `ref` callbacks will be called before `componentDidMount`.
React will call the `ref` callback with the DOM element when the component mounts, and call it with `null` when it unmounts. `ref` callbacks are invoked before `componentDidMount` or `componentDidUpdate` lifecycle hooks.
Using the `ref` callback just to set a property on the class is a common pattern for accessing DOM elements. The preferred way is to set the property in the `ref` callback like in the above example. There is even a shorter way to write it: `ref={input => this.textInput = input}`.