Added docs about the ref-as-callback.
Jim committed
Mar 10, 2015 at 12:19 UTC
f3811e68fa0cf1c19a24eb9122fa5793f0ab7f84
1 file changed
+13
-1
docs/docs/08.1-more-about-refs.md
+13
-1
@@ -65,7 +65,7 @@ In this counterexample, the `<input />` is merely a *description* of an `<input
65
66
So how do we talk to the *real* backing instance of the input?
67
68
-## The ref Attribute
68
+## The ref String Attribute
69
70
React supports a very special property that you can attach to any component that is output from `render()`. This special property allows you to refer to the corresponding **backing instance** of anything returned from `render()`. It is always guaranteed to be the proper instance, at any point in time.
71
@@ -85,6 +85,18 @@ It's as simple as:
85
86
You can access the component's DOM node directly by calling `React.findDOMNode(this.refs.myInput)`.
87
88
+
89
+## The ref Callback Attribute
90
+
91
+The `ref` attribute can be a callback function instead of a name. This callback will be executed immediately after the component is mounted. The referenced component will be passed in as a parameter, and the callback function may use the component immediately, or save the reference for future use (or both).
92
+
93
+It's as simple as assigning a `ref` attribute to anything returned from `render` such as:
94
+
95
+ ```html
96
+ <input ref={ function(component){ React.findDOMNode(component).focus();} } />
97
+ ```
98
+
99
+
100
## Completing the Example
101
102
```javascript