@1)每個(gè)文件都會(huì)有這么一句話 import React from 'react'
@2）關(guān)于合成事件 event，不知道你有沒有這樣的困惑餐禁，如下代碼（e這個(gè)事件是哪里來的呢血久？）
function ActionLink() {
// 注：這里的e是哪里來的呢？
function handleClick(e) {
e.preventDefault();
console.log('鏈接被點(diǎn)擊');
}
return (
<a href="#" onClick={handleClick}> //這里我并沒有傳入e這個(gè)參數(shù)
點(diǎn)我
</a>
);
}
其實(shí)是這樣子的帮非，當(dāng)你從了解react開始就會(huì)聽說虛擬dom這個(gè)東西了吧氧吐，這里你沒有聽說過也沒有關(guān)系（這里一時(shí)半會(huì)也解釋不清，后面文章我會(huì)單獨(dú)去解釋這個(gè)東西末盔，你先知道有這么個(gè)東西）筑舅，就是這個(gè)虛擬dom實(shí)現(xiàn)了一個(gè)合成事件層，我們所定義的事件處理器會(huì)接收到這個(gè)合成事件處理對(duì)象的實(shí)例event且我們不用關(guān)心跨平臺(tái)的問題陨舱，再說白一點(diǎn)翠拣，就是我們定義一個(gè)函數(shù)，只要我們把它交給類似onClick,onChange這樣的事件處理程序游盲，那么這個(gè)函數(shù)就會(huì)獲得event
@4）組件的生命周期熙卡，初學(xué)react的你是不是被componentWillMount/componentDidMount函數(shù)執(zhí)行一次杖刷，componentWillUpdate等函數(shù)在更新之前調(diào)用弄暈了呢，其實(shí)單單看函數(shù)的英譯驳癌，我們大概也猜出來意思，但是為什么在組建的生命周期中只執(zhí)行一次呢役听？這是因?yàn)閞eact為組件劃分了這么幾個(gè)階段如下圖
也就是說每個(gè)函數(shù)執(zhí)行是對(duì)應(yīng)上面的三個(gè)階段的（掛載→更新→卸載）這里組件更新階段shouldComponentUpdate()函數(shù)是可以阻止render()渲染的颓鲜，就是當(dāng)你state改變我們將這個(gè)函數(shù)的返回值設(shè)為false，你會(huì)發(fā)現(xiàn)頁面并沒有任何改變
@5）ref(reference)是react支持的一種非常特殊的屬性典予，你可以用來綁定到render()輸出的任何組件上甜滨，也就是你可以在任何時(shí)間能準(zhǔn)確的拿到綁定組件的實(shí)例,舉個(gè)例子
//首先這里的input這個(gè)參數(shù)是自動(dòng)接收的，它可以是任何的名字瘤袖，它代表<input></input>這個(gè)標(biāo)簽
//而this.input = input 也就是給當(dāng)前類實(shí)例TodoList中的this增加一個(gè)屬性input
//使其this.input屬性指向<input></input>實(shí)例
class TodoList extends Component{
render(){
return(
<input ref={input => this.input = input}></input>
)
}
changeValue = () =>{
this.input.value = "hello world"
}
}
@6）react中還有很多慢慢探索的細(xì)節(jié)衣摩，這里的總結(jié)是自己當(dāng)初學(xué)習(xí)迷惑的地方
react性能優(yōu)化部分(這里初學(xué)的時(shí)候可能不理解，但是后面代碼練習(xí)中你就會(huì)了解到啦)
1.this綁定捂敌，你可以使用es6 語法中的箭頭函數(shù)或者在構(gòu)造函數(shù)綁定this,而不是這樣綁定（onClick = {this.changValue.bind(this)}）
2.setState設(shè)計(jì)成異步艾扮，這里在上面已經(jīng)講過啦，如果你還是不很理解的話也不要急
3.shouldCompentUpdate 這個(gè)函數(shù)可以阻止render函數(shù)的執(zhí)行占婉，頁面渲染也是相當(dāng)耗費(fèi)性能的泡嘴，這里在上面也已經(jīng)講過啦
4.虛擬dom，這個(gè)后面再寫吧逆济，先知道這個(gè)概念吧
初識(shí)react：http://www.reibang.com/p/b683a9bac335
