More explicit class method for ref doc (#10228)
After realizing this was the second time I've visited this exact page within a year and second guessing myself that the `textInput` ref isn't actually the `<input />` element. I decided to attempt to make this a little more explicit; you are actually accessing the method on the child class and not the `focus` method on the dom input element. Having them named the same caused some confusion.
Brian Emil Hartz committed
Sep 10, 2017 at 15:48 UTC
6d37c05dd7d42cf44805222f8b03a87474e21c42
1 file changed
+3
-3
docs/docs/refs-and-the-dom.md
+3
-3
@@ -39,10 +39,10 @@ When the `ref` attribute is used on an HTML element, the `ref` callback receives
39
class CustomTextInput extends React.Component {
40
constructor(props) {
41
super(props);
42
- this.focus = this.focus.bind(this);
42
+ this.focusTextInput = this.focusTextInput.bind(this);
43
}
44
45
- focus() {
45
+ focusTextInput() {
46
// Explicitly focus the text input using the raw DOM API
47
this.textInput.focus();
48
}
@@ -77,7 +77,7 @@ When the `ref` attribute is used on a custom component declared as a class, the
77
```javascript{3,9}
78
class AutoFocusTextInput extends React.Component {
79
componentDidMount() {
80
- this.textInput.focus();
80
+ this.textInput.focusTextInput();
81
}
82
83
render() {