mirror of
https://github.com/zebrajr/react.git
synced 2025-12-07 12:20:38 +01:00
Add documentation about React.renderComponent
Recently learned that components passed into `React.renderComponent` may not be the ones actually mounted. Also learned that it returns the mounted component. Added some documentation describing this.
This commit is contained in:
parent
b225b34f91
commit
43a242b67f
|
|
@ -46,7 +46,7 @@ ReactComponent renderComponent(
|
|||
)
|
||||
```
|
||||
|
||||
Render a React component into the DOM in the supplied `container`.
|
||||
Render a React component into the DOM in the supplied `container` and return a reference to the component.
|
||||
|
||||
If the React component was previously rendered into `container`, this will perform an update on it and only mutate the DOM as necessary to reflect the latest React component.
|
||||
|
||||
|
|
|
|||
31
docs/tips/16-references-to-components.md
Normal file
31
docs/tips/16-references-to-components.md
Normal file
|
|
@ -0,0 +1,31 @@
|
|||
---
|
||||
id: references-to-components
|
||||
title: References to Components
|
||||
layout: tips
|
||||
permalink: references-to-components.html
|
||||
prev: expose-component-functions.html
|
||||
---
|
||||
|
||||
If you're using React components in a larger non-React application or transitioning your code to React, you may need to keep references to components. `React.renderComponent` returns a reference to the mounted component:
|
||||
|
||||
```js
|
||||
/** @jsx React.DOM */
|
||||
|
||||
var myComponent = React.renderComponent(<MyComponent />, myContainer);
|
||||
```
|
||||
|
||||
If you pass a variable to 'React.renderComponent`, it's not guaranteed that the component passed in will be the one that's mounted. In cases where you construct a component before mounting it, be sure to reassign your variable:
|
||||
|
||||
```js
|
||||
/** @jsx React.DOM */
|
||||
|
||||
var myComponent = <MyComponent />;
|
||||
|
||||
// Some code here...
|
||||
|
||||
myComponent = React.renderComponent(myComponent, myContainer);
|
||||
```
|
||||
|
||||
> Note:
|
||||
>
|
||||
> This should only ever be used at the top level. Inside components, let your `props` and `state` handle communication with child components, and only reference components via `ref`s.
|
||||
Loading…
Reference in New Issue
Block a user