1、JSX更接近於js而不是HTML，所以React DOM使用駝峰屬性命名規則來取代原來的HTML屬性名。

2、JSX的本質是個函數對象。下面兩個例子是相似的：

const element = (
  <h1 className="greeting">
    Hello, world!
  </h1>
);

const element = React.createElement(
  ‘h1‘,
  {className: ‘greeting‘},
  ‘Hello, world!‘
);

3、將一個React元素渲染到根節點裏，通過ReactDOM.render()。

4、局部更新：React DOM會將元素和子元素與之前的狀態比較，然後只更新必要的部分使DOM變為所希望的狀態。

5、React組件的首寫字母必須大寫。舉個例子，<div/>代表一個DOM標簽，但是<Welcome />代表一個一個組件。

6、正確使用state：避免使用this.state.name=value的方式來更新state，這樣並不會重新渲染DOM。采用this.setState方式。

7、調用this.setState後state的值可能不會立即改變。更安全的做法是使用函數做為setState的參數。

this.setState((prevState, props) => ({
  counter: prevState.counter + props.increment
}));

8、組件的render方法返回null不會影響組件的生命周期方法的運行。比如，componentWillUpdate和componentDidUpdate將一直被調用。

9、關列列表：key幫助React鑒別哪一項發生了改變，添加了，或者移除了。key應該添加在數組裏的元素身上作為一個穩定的特性。

10、HTML表單(form)和 React托管的表單略有不同。兩種獲取值的方式也不同：

//通過state管理value
<textarea value={this.state.value} onChange={this.handleChange} />

//通過refs管理value
<CustomTextInput ref={(input) => { this.textInput = input; }} />

11、PropTypes已經被新版本React移除了，請獨立安裝並使用‘prop-types‘庫。

12、正確使用ref屬性。字符串refs已經不推薦使用，請使用行間函數的方式指定ref。

13、在React渲染的生命周期中，表單元素中的value屬性會重寫DOM中的元素。而使用非控制組件，你經常想要讓React指定初始value值，但是讓之後的值來更新非控制組件。

　　為了解決這個問題，你可以指定defaultValue屬性替代value值：

//控制組件：用React的state來控制表單元素的value值;
//非控制組件:表單數據就被DOM本身所處理

render() {
  return (
    <form onSubmit={this.handleSubmit}>
      <label>
        Name:
        <input
          defaultValue="Bob"
          type="text"
          ref={(input) => this.input = input} />
      </label>
      <input type="submit" value="Submit" />
    </form>
  );
}

14、不使用ES6：

class Greeting extends React.Component {

　　constructor(props) {　　　　//設置初始化state
    　　super(props);
    　　this.state = {count: props.initialCount};
  　　}

　　Greeting.propTypes = {　　　　//設置初始化prop類型
  　　name: React.PropTypes.string
　　};

　　Greeting.defaultProps = {　　　　//設置默認props值
  　　name: ‘Mary‘
　　};

　　render() { 　　　　//事件需要手動綁定this
　　　　return <h1 onClick={this.handleClick.bind(this)} >Hello, {this.props.name}</h1>;
　　} 
}

var Greeting = React.createClass({

　　propTypes: {　　　　//設置初始化prop類型
    　　name: React.PropTypes.string
  　},

　　getInitialState: function() {　　　　//設置默認state
    　　return {
　　　　　　count: this.props.initialCount
　　　　 };
  　},

　  getDefaultProps: function() {　　　　//設置默認props
 　　　　return { 　　
　　　　　　name: ‘Mary‘ 　　
　　　　　}; 　
　　},

　　render: function() { 　　　　//自動綁定當前this
　　　　return <h1 onClick={this.handleClick} >Hello, {this.props.name}</h1> 
　　} 
});

15、react並不推薦使用context，如果你沒有用的context，那麽恭喜你。

React零碎知識點回顧