React学习笔记（二）

React 组件语法

<div id="example"></div>
<script type="text/babel">
   class MyPage extends React.Component {
       render() {return <h4>Hello  我们在一起吧</h4>;}
   };
   ReactDOM.render(<MyPage/>,document.getElementById('example'));
</script>

1. class MyTitle extends React.Component是 ES6 语法，表示自定义一个MyTitle类，该类继承了基类React.Component的所有属性和方法。
2. React 规定，自定义组件的第一个字母必须大写，比如MyTitle不能写成myTitle，以便与内置的原生类相区分。
3. 每个组件都必须有render方法，定义输出的样式。
4. 表示生成一个组件类的实例，每个实例一定要有闭合标签，写成也可。

React 组件的参数

<div id="example"></div>
<script type="text/babel">
    class MyTitle extends React.Component {
      render() {
        return <h1 style={{color: this.props.color}}>Hello World</h1>;
      }
    };
    ReactDOM.render(
      <MyTitle color="red" />,
      document.getElementById('example')
    );
</script>

组件内部通过this.props对象获取参数。