2017-04-25 2 views
0

저는 React Native에서 앱을 만들고 있는데 이해가 안되는 문제가 있습니다.TouchableHighlight OnPress가 함수를 호출하지 않습니다.

사실 내 목록의 버튼을 누르면이 버튼과 관련된 onPress 속성이 내 기능을 호출하지 않습니다.

_onPressButton=() => { 
    Alert.alert("Lol"); 
} 

_renderRow (rowData, sectionID) { 
return (
    <TouchableOpacity style={styles.row} onPress={() => this._onPressButton}> 
    <Text style={styles.boldLabel}>{rowData.name}</Text> 
    <Text style={styles.label}>{rowData.art}</Text> 
    </TouchableOpacity> 
) 
} 

이 두 함수는 내 클래스의 render() 외부에 있습니다. 렌더링이 있습니다 :

render() { 
return (
    <View style={styles.container}> 
    <ListView 
     renderSectionHeader={this._renderHeader} 
     contentContainerStyle={styles.listContent} 
     dataSource={this.state.dataSource} 
     renderRow={this._renderRow} 
     renderFooter={this._renderFooter} 
     enableEmptySections 
     pageSize={15} 
    /> 
    </View> 
) 
} 
} 

그래서 내 버튼을 누르면 아무 일도 일어나지 않습니다 : /. 누군가 제발 아이디어가 있으십니까? 읽어 주셔서 감사합니다.

답변

0

_onPressButton 함수를 호출하지 않았습니다. 당신은 다음과 같이 화살표 기능을 사용하지 않고 onPress에 핸들러에이 기능을 전달할 수 있습니다

onPress={this._onPressButton} 

당신이 다음 화살표 기능을 감아 수있는 매개 변수를 전달합니다.

onPress={() => {this._onPressButton('someParams')}} 

PS는 현재 코드는

onPress={() => {this._onPressButton}} // _onPressButton is not invoked 
you have to invoke it as: 

{() => {this._onPressButton()}} 
+0

감사합니다. 하지만 분명히 renderRow = {this._renderRow.bind (this)}를 렌더링에 써야했습니다. 왜 그런지 알아? –

+0

jsx에서이 키워드를 호출하면 "this"키워드의 컨텍스트가 손실되므로 바인드해야합니다. 나는 생성자에서 함수 바인딩을 제안한다 this._renderRow = this._renderRow.bind (this); 또는 _onPressButton에서 사용한 것처럼 화살표 기능을 사용하십시오. –

+0

대단히 감사합니다! –

1

내가 올바른 방법이 모두 같은 생성자에 바인더 제본 모두 renderRow & onRowPress을 가지고 생각하여 _onPressButton의 함수 onPress에 핸들러를 호출하지만 호출하지 않습니다 :

constructor (props) { 
    super(props) 

    this.renderRow = this.renderRow.bind(this) 
    this.onRowPress = this.onRowPress.bind(this) 

    } 

그런 다음 o n renderRow

renderRow (rowData) { 
    return (
     <TouchableOpacity onPress={() => this.onRowPress(rowData)} > 

     </TouchableOpacity> 
    ) 
    } 
관련 문제