React component参数传递
2015-10-21 00:00
423 查看
一.
二.
var FancyCheckbox = React.createClass({ render: function() { var fancyClass = this.props.checked ? 'FancyChecked' : 'FancyUnchecked'; return ( <div className={fancyClass} onClick={this.props.onClick}> {this.props.children} </div> ); } }); ReactDOM.render( <FancyCheckbox checked={true} onClick={console.log.bind(console)}> Hello world! </FancyCheckbox>, document.getElementById('example') );
二.
var FancyCheckbox = React.createClass({ render: function() { var { checked, ...other } = this.props; var fancyClass = checked ? 'FancyChecked' : 'FancyUnchecked'; // `other` contains { onClick: console.log } but not the checked property return ( <div {...other} className={fancyClass} /> ); } }); ReactDOM.render( <FancyCheckbox checked={true} onClick={console.log.bind(console)}> Hello world! </FancyCheckbox>, document.getElementById('example') );
相关文章推荐
- Thinking in GraphQL #Facebook Relay文档翻译#
- React ——第一个程序
- react js 笔记——环境搭建
- Web开发的未来:React、Falcor和ES6
- MVVM without ReactiveCocoa
- React对state的初级理解
- React Namespaced Components
- React参数操作
- React 遍历集合
- React PropTypes
- React Mixin
- React-Native for Android
- React-Native进行时(四)--ListView navigator.push
- ACE_Reactor(六)ACE_TP_Reactor
- ACE_Reactor(五)ACE_TP_Reactor和ACE_Select_Reactor的区别
- ACE_Reactor(四):ACE_WFMO_Reactor
- ACE_Reactor(三)ACE_Select_Reactor_T
- ACE_Reactor(二)ACE_Dev_Poll_Reactor
- ACE_Reactor(一)整体理解ACE_Reactor
- React.js model