Beruflich Dokumente
Kultur Dokumente
Lifecycle
React.createClass({
componentWillMount()
render: function () {
componentDidMount()
return (
<div>Hello {this.props.name}</div>
componentWillReceiveProps(props)
);
shouldComponentUpdate(props, state)
componentWillUpdate(props, state)
});
componentDidUpdate(prevProps, prevState)
componentWillUnmount()
Using components
Initial States
React.createClass({
States
getInitialState: function () {
return {data: []};
},
render: function () {
return (
<CommentList data={this.state.data} />
Properties
);
this.setProps({ fullscreen: true });
});
API
React.createClass({
c.getDOMNode() // deprecated 0.13
getDefaultProps: function () {
React.findDOMNode(c) // 0.13+
c.forceUpdate()
c.isMounted()
);
Methods
Before Rendering
React.createClass({
render: function()
componentWillMount: function () {
getInitialState: function()
getDefaultProps: function()
this.setState(data);
mixins: []
});
},
render: function () {
return (
By kitallis
Sponsored by CrosswordCheats.com
cheatography.com/kitallis/
Page 1 of 3.
http://crosswordcheats.com
Property validations
React.createClass({
);
propTypes: {
// required
requiredFunc: React.PropTypes.func.isRequired,
});
requiredAny: React.PropTypes.any.isRequired,
Actions
<form onSubmit={this.handleSubmit}>
func: React.PropTypes.func,
number: React.PropTypes.number,
</form>
string: React.PropTypes.string,
React.createClass({
});
Class set
}
})
render: function() {
var cx = React.addons.classSet;
Two-way binding
React.createClass({
'message-important': this.props.isImportant,
mixins: [React.addons.LinkedStateMixin],
'message-read': this.props.isRead
getInitialState: function() {
});
},
render: function() {
return <input type="text" valueLink=
{this.linkState('value')} />;
}
Propagating properties to children
}
});
render: function() {
component called
// linkState().
controls='false' />;
Lists
});
By kitallis
Sponsored by CrosswordCheats.com
cheatography.com/kitallis/
Page 2 of 3.
http://crosswordcheats.com
Sponsored by CrosswordCheats.com
cheatography.com/kitallis/
Page 3 of 3.
http://crosswordcheats.com