一个简单实例:
1 var Test = React.createClass({
2 render: function(){
3 return <div>Hello {this.props.title}</div>;
4 }
5 });
6
7 ReactDOM.render(
8 <Test title="World"/>,
9 document.getElementById('example')
10 );
①、如果在js里面直接写类DOM的时候一般用()包裹起来。在DOM里面写js代码时一般用{}包裹起来。
②、在第三行的div标签并不是真正的DOM元素,是一个React component实例。
③、怎么声明:自定义的React component通过调用React.createClass()方法来进行创建。最重要的参数render直接定义了被渲染出来的什么样的结构。
④、怎么渲染:通过调用React.render()方法,将实例呈现到页面。第一个参数是我们要渲染的React component实例。第二个参数是渲染后要插入位置的容器。
⑤、如果现在DOM中定义class,用className。例:<div class="aa"></div>需要写成<div className="aa"></div>
⑥、内联样式:需要用样式对象来表示,属性名用小驼峰法表示。例:<div style={{color: 'red', fontSize: '32', marginLeft: '10px'}}></div>