react nocojs
Post on 14-Apr-2017
198 Views
Preview:
TRANSCRIPT
function HelloMessage(props) { return <div>Hello {props.name}</div>;}ReactDOM.render(<HelloMessage name="Sebastian" />, mountNode);
var HelloMessage = (props) => <div>Hello {props.name}</div>;ReactDOM.render(<HelloMessage name="Sebastian" />, mountNode);
ES6
ES5
export class Counter extends React.Component { constructor(props) { super(props); this.state = {count: props.initialCount}; } tick() { this.setState({count: this.state.count + 1}); } render() { return ( <div onClick={this.tick.bind(this)}> Clicks: {this.state.count} </div> ); }}Counter.propTypes = { initialCount: React.PropTypes.number };Counter.defaultProps = { initialCount: 0 };
- no autobinding - no mixins - propTypes, defaultProps
Resources
https://facebook.github.io/react/ https://webpack.github.io/ https://github.com/HenrikJoreteg/hjs-webpack https://quickleft.com/blog/testing-flux-applications/ https://ampersandjs.com/ https://facebook.github.io/flux/ https://github.com/rackt/redux http://alt.js.org/ http://reactkungfu.com/
top related