反应本地模式与列表视图项目点击

Question

我想模拟弹出一个视图，当一个列表项被点击。并使用此代码，它工作正常，如果我不滚动列表视图，并根本不工作，如果我滚动。

renderGymData(rowData){ 
return(
<View> 
     <Modal 
      animationType={'none'} 
      transparent={false} 
      visible={!!this.state.selectedRow}> 
      .... 
     </Modal> 

     <TouchableHighlight onPress={() => this.showGymDetail(rowData)} > 
     .... 
     </TouchableHighlight> 
     </View>); 
} 
and the render method of my list view is 

render() { 

    return (
     <ListView 
     dataSource={this.state.dataSource} 
     renderRow={this.renderGymData.bind(this)} 
     style={styles.listView}> 
     </ListView> 
    ); 

}

我不想使用navigator.push因为我想以模态出现。

Answer 1

只使用一个模态，并将其渲染为波纹管ListView，而不是renderRow，并在列表项被点击时将行数据传递给模态。

render() { 
    return (
    <View> 
     <ListView 
     dataSource={this.state.dataSource} 
     renderRow={this.renderGymData.bind(this)} 
     style={styles.listView}> 
     </ListView> 
     <Modal 
      animationType={'none'} 
      transparent={false} 
      visible={!!this.state.selectedRow}> 
      .... 
     </Modal> 
    </View> 
); 
}