ReactJs 样式类的使用

渲染标签上className={} 来设置样式 类名  

直接class="XX" 这样是不行的，只能用className值 为js变量才行。

如有时样式 类引用会动态改变，需要用React.addons.classSet() 来创建对象

参数可以是多个字符串,或对象{clasname:this.XX} 动画修改组件属性来实现是否引用类名

以下是例子：

/*className用法
			 * 
			 */
			var Box=React.createClass({
				render:function(){
					var classname="cl1 cl2";
					return (
					    <div className={classname}>
					    	朝秦暮楚
					    </div>
					)
				}
			});
			React.render(<Box></Box>,document.querySelector('#div1'));
			
			var Box1=React.createClass({
				getInitialState:function(){
					return {
						bool:this.props.isa
					}
				},
				handleboolchange:function(event){
					this.setState({bool:event.target.checked})
				},
				render:function(){
					var cx=React.addons.classSet;
					var clname=cx({
						"cl1":true,
						"cl2":this.state.bool
					});
					return (
					    <div className={clname}>
					    	fdafdas
					    	<input type="checkbox" checked={this.state.bool} onChange={this.handleboolchange}  />
					    </div>
					)
				}
			});
			React.render(<Box1 isa={false}></Box1>,document.querySelector('#div2'));
			
			var Box2=React.createClass({
				render:function(){
					var cla=React.addons.classSet('cl1','cl2')
					return (
					    <div className={cla}>
					    	(XX,XX)
					    </div>
					)
				}
			});
			
			React.render(<Box2 ></Box2>,document.querySelector('#div3'));