listview - React Native动态ListView主细节

Question

任何人都可以通过提供一个包含一行的 ListView 示例来帮助我，按下时通过导航器将包含行名称的 Prop 传递给另一个组件吗？我似乎找不到任何关于此的信息，而且我找到的示例和答案有很多不同的语法，这使得我无法知道何时应该绑定(bind)一个函数和简单的 this.state 东西。

Answer 1

您基本上将导航函数设置为从 ListView renderRow 方法接受数据作为参数:

_navigate(title) {
  this.props.navigator.push({
    name: 'Page2',
    passProps: {
      title
    }
  })
}

然后在您的 renderRow 方法中附加此函数，如下所示:

renderRow (rowData) {
  return <TouchableOpacity
           style={{height: 60, backgroundColor: 'red'}}
           onPress={() => this._navigate(rowData.title)}>
             <Text>{rowData.title}</Text>
         </TouchableOpacity>
}

我在 RNPlay 上设置了工作示例 here .

https://rnplay.org/apps/-tbxbQ