React Native學習筆記

React 是使用ES6 ,支持JSX語法, 開發組件化web或native的工具. 現階段使用Babel工具轉換成ES5 代碼.

組件經過props屬性傳遞不變化的內容,UI經過state屬性變更來產生變化.

React 一個界面框架, 數據的管理在js中比較麻煩, 容易混亂 . 有個redux庫能夠管理一個統一的數據存儲點. 一個應用只有一個Store對象,內部是一個全局可隨處訪問的變量.

 

Redux 的三個概念 :

   container, reduce, actions .

 

1. 建立container, container是一個包含了業務邏輯代碼, 負責數據顯示過濾和事件綁定的概念. 實際使用connect自動建立.

    包括兩個方法 mapStateToProps 和mapDispatchToProps. 最後一句代碼connect(mapStateToProps,mapDispatchProps)(UIComponent),有兩個括號,第一個裏就寫這兩個定義的方法,後面的括號寫這些props要在哪一個UI組件類中使用.

 

2. reduce是一個可傳遞兩個參數(state,action) ,返回變化後的state的函數. 核心概念是不直接修改state值,經過Object.assign({},state,{要覆蓋的新值屬性keyvalue}) 建立新對象返回.

3. actions 是一些functions 表示執行的動做,方法名能夠定義爲addNews,listNews,delNews這種動詞,實際直接返回一個{key:"ADD_NEWS","other":"dfdsfdsf"},除key之外能夠定義傳遞給事件處理須要的參數.

 

4.怎麼觸發action? 

 經過全局方法dispatch(action,自定義參數)觸發.

 

5.組件中的事件最好寫成closure的形式,其餘形式可能會沒法找到方法之類的,原理就是此this不是須要的this致使.

closure 寫法: 

 var clickGetUserInfo = (id)=> {

   this.refs.uiEle.text = "23421323" 

 }

 

  render() {

    <View onClick={clickGetUserInfo} ref="uiEle">

 }