Clarify react
This commit is contained in:
parent
30f72174a5
commit
18ab38aa49
26
react.md
26
react.md
|
@ -39,22 +39,30 @@ var Info = React.createClass({
|
||||||
```
|
```
|
||||||
|
|
||||||
## States & Properties
|
## States & Properties
|
||||||
|
Use [props](https://facebook.github.io/react/docs/tutorial.html#using-props) (`this.props`) to access parameters passed from the parent.
|
||||||
|
Use [states](https://facebook.github.io/react/docs/tutorial.html#reactive-state) (`this.state`) to manage dynamic data.
|
||||||
|
{:.center}
|
||||||
|
|
||||||
```js
|
```js
|
||||||
this.setState({ editing: true });
|
this.setProps({ fullscreen: true });
|
||||||
this.state.editing === true
|
this.setState({ username: 'rstacruz' });
|
||||||
|
|
||||||
|
this.props.fullscreen === true
|
||||||
|
this.state.username === 'rstacruz'
|
||||||
|
|
||||||
|
this.replaceProps({ ... });
|
||||||
this.replaceState({ ... });
|
this.replaceState({ ... });
|
||||||
```
|
```
|
||||||
|
|
||||||
```js
|
```js
|
||||||
this.setProps({ fullscreen: true });
|
render: function () {
|
||||||
this.props.fullscreen === true
|
return <div class={this.props.fullscreen ? 'full' : ''}>
|
||||||
|
Welcome, {this.state.username}
|
||||||
this.replaceProps({ ... });
|
</div>;
|
||||||
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
### Initial data
|
### Setting defaults
|
||||||
|
|
||||||
```js
|
```js
|
||||||
React.createClass({
|
React.createClass({
|
||||||
|
@ -355,8 +363,8 @@ return <div style={style}></div>;
|
||||||
See [dangerously set innerHTML](https://facebook.github.io/react/tips/dangerously-set-inner-html.html).
|
See [dangerously set innerHTML](https://facebook.github.io/react/tips/dangerously-set-inner-html.html).
|
||||||
|
|
||||||
```js
|
```js
|
||||||
function createMarkup() { return {__html: 'First · Second'}; };
|
function markdownify() { return "<p>...</p>"; }
|
||||||
<div dangerouslySetInnerHTML={createMarkup()} />
|
<div dangerouslySetInnerHTML={{__html: markdownify()}} />
|
||||||
```
|
```
|
||||||
|
|
||||||
### Lists
|
### Lists
|
||||||
|
|
Loading…
Reference in New Issue