React Native 使用問題記錄

標籤：

1.<View></View>之間有空格會報錯 Trying to add unknown view tag

2.一些js文法糖注意點
http://facebook.github.io/react-native/docs/javascript-environment.html#content
函數運算式文法:
()=>xxx 等於 function(){return xxx;}
函數運算式文法:
state={a:1,B:2,C:3}
...state 等於 1,2,3

3.組件onPress事件參數
參數類型ResponderSyntheticEvent
可能通過e.nativeEvent擷取座標資訊 結構{identifier,timeStamp,locationY, locationX,pageX,pageY,target}
target是數字

4.組件onLayout事件參數
參數類型SyntheticEvent
可能通過e.nativeEvent.layout擷取座標資訊 結構 {height, width, y.5, x}

 

5.一個組件引用js對像的bug

<View style={[styles.circle,this._circleStyles]}/>//用這種方式無法取到樣式this._circleStyles.left = this._previousLeft + gestureState.dx;this._circleStyles.top = this._previousTop + gestureState.dy;//用這種可以this._circleStyles = {left: this._previousLeft + gestureState.dx,top: this._previousTop + gestureState.dy};

 

6.ref和refs
組件中render產生的標籤可以通過ref屬性設定欄位名稱。在組件中可以通過this.refs[‘myRefString‘]或this.refs.myRefString引用對應標籤

 

render: function() {return <Text ref="myInput" />;},componentDidMount: function() {this.refs[‘myInput‘]this.refs.myInput}//ref也可以做為回呼函數,回調參數為標籤的引用render: function() {return <Text ref={(c) => this._input = c} />;},componentDidMount: function() {this._input.focus();}

 

 

 

React Native 使用問題記錄