Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 13 additions & 1 deletion docs/docs/08.1-more-about-refs.md
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@ In this counterexample, the `<input />` is merely a *description* of an `<input

So how do we talk to the *real* backing instance of the input?

## The ref Attribute
## The ref String Attribute

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.

Expand All @@ -85,6 +85,18 @@ It's as simple as:

You can access the component's DOM node directly by calling `React.findDOMNode(this.refs.myInput)`.


## The ref Callback Attribute

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).

It's as simple as assigning a `ref` attribute to anything returned from `render` such as:

```html
<input ref={ function(component){ React.findDOMNode(component).focus();} } />
```


## Completing the Example

```javascript
Expand Down