本週主要任務完成情況
本週是我工作的第一個星期，由於對項目架構不瞭解所以本週沒有進行實際的任務，主要是學習React+Redux+ES6的基礎知識。以前都是用的jquery,在這個坑裏難以跳出來。學習了React後對前端開發有了新的認識，就像學習了一門新語言，雖然還不能熟練地用React的思想去思考，但是能感覺到React組件開發的便利，相信我也會喜歡上高大上的React。 0.0
下週的計劃
主要是高質量地完成工作的第一份任務。
在rc上敏感影集列表增加一個點擊該用戶暱稱ID,跳轉到用戶的個人中心（1d）；
評論流水中增加一個點擊該用戶暱稱ID,跳轉到用戶的個人中心(1d)。
繼續學習和鞏固React+Redux+ES6,並用其知識幫助理解op項目代碼細節。
- 看rc項目代碼，不理解的向大牛提問。
學習和成長
主要將React+Redux官方英文文檔看了一遍，學習了很多新單詞，對React組件開發有了大致認識，一下子看的有點多,瞭解的不深入，有一些細節下週研究。
1. React
JSX： js的語法擴展，在js中寫html可以生成dom元素，十分方便易於讀寫，還可以使用表達式。它是用babel轉碼器在編譯階段轉換成正常js的。
組件：React是單向數據流，父組件通過props向子組件傳遞數據，子組件只讀取不修改。子組件可以通過回調函數該變父組件state向父組件傳遞數據。
兩個子組件間傳遞數據要通過父組件。過程如下：
I. 找一個共同的父組件,state放在父組件。
II. 其中一個子組件通過父組件傳遞的回調函數改變state。
III. state改變會同過props自動更新另一個子組件的UI。
2. Redux
按文檔將Todo List demo敲了一遍。主要學習了三個內容：
(1) Action：Redux中state是不能修改的，只能添加，是爲了能夠實現回退功能，結果只能用action添加新的state,action是唯一數據來源。action的結構一般是
{
type:意圖類型，表示要幹什麼（對state進行什麼樣的修改）
data:數據，表示要怎麼幹（把state修改爲什麼）
}通常建立action創建函數，保存在actions目錄中，action創建函數結構：
function actionName(data){
return{
type:actionName,//大寫加下劃線
data
}
}(2) Reducer:連接action和state的橋樑，就像MVC中C是M和V的橋樑。reducer函數結構一般是：
function reducerName(prevState=initialState,action){
switch(action.type){
case type1:
.
.
.
default:
return prevState;
}
}(3) Store:存儲state的數據結構，應該用的棧結構。用法：
let store =createStore(App);
store.getState()//獲取當前state,就是棧頂的state
store.dispatch(action)//執行一個action更新state
let listener=store.subscriber(listener)//註冊監聽器,當state變化時執行listener回調
listener()//註銷監聽器3. react-redux
<Provider store={store}>
<App />
</Provider>將整個組件的state儲存在store中。Provider讓我想起了Android中的四大組件之一Provider,是提供數據的東西，在這裏store也是提供數據的。
還有個connect是連接多個reducer的，這個示例代碼看得不太懂，下週好好研究一下。
4. react-router
把官方示例做了一遍，學習瞭如下內容。
(1)
<Router history={hashHistory}>
<Route path="/" component={App}>
<IndexRoute component={Home}/>
<Route path="/repos" component={Repos}/>
<Route path="/about" component={About}/>
＜Redirect from="/about" to="/repos" />
＜IndexRedirect to="/welcome" />
</Route>
</Router>(I) 嵌套路由。從左到右檢查pathname,匹配時進入子Route繼續匹配。
(II) IndexRoute是完全匹配.
(III)Redirect。當匹配‘/about’時跳轉到‘/repos’。
(IV)當路由匹配到一個路由時不再往下匹配，所以上面Redirect不會生效。
(V) IndeRedirect.訪問根路由時跳轉到‘/Welcome’。
(2). Link&&IndexLink
<Link to="/about">About</Link>對a鏈接進行包裝，生成一個指向to的鏈接。有activeClassName屬性，可以設置鏈接激活時的樣式。
5. rc項目
(1).瞭解了一下結構
(2).針對一個Message頁看了一下組件結構
整個頁面加載之前：
Layout
GloableInitOnce
GloableLoadingMask
GloableConfirmDialogMsgPage加載完成:
Header
AlertBar
MsgTabBar
UserTabBar
AllTabBar
UnreplayUserCheckBox
MsgListContainer
MsgBox
.
.
.
Pagination