React native 如何在react native中将整个分区列表包装在TouchableOpacity组件中

我目前在我的一个组件中有一个分区列表。代码如下：

<SectionList
  renderItem={({item, index, section}) =>
  <TouchableOpacity onPress={ () => this.onPressOrder(item) }>
    <View>
      <Text key={index}>
      {item}
      </Text>
    </View>
  </TouchableOpacity>
}
  renderSectionHeader={({section: {title}}) => (
    <Text style={{fontWeight: 'bold'}}>{title}</Text>
  )}
  sections={this.state.dataSource}
  keyExtractor={(item, index) => item + index}
/>

这就是我创建数据源的方式。渲染后，它将显示如下所示：

---

列表在其自己的行上渲染每个元素的方式有其自己单独的TouchableOpacity。我想要的是整个数据块是它自己的不透明度。分区列表数据可以用TouchableOpacity包装吗？

我不相信可以包装分区列表的每个部分，但似乎可以很容易地将整个

列表项

渲染为单个项目，因此每个分区在

数据中只有一个元素

<SectionList
  renderItem={({item, index, section}) =>
  // render the entire item in the `renderItem` call with one `TouchableOpacity`
  <TouchableOpacity onPress={ () => this.onPressOrder(item.id) }>
    <View>
      <Text>
      {item.inspector}
      </Text>
    </View>
     <View>
      <Text>
      {item.inspection_date}
      </Text>
    </View>
    ... etc.
  </TouchableOpacity>
}
  renderSectionHeader={({section: {title}}) => (
    <Text style={{fontWeight: 'bold'}}>{title}</Text>
  )}
  sections={this.state.dataSource}
  keyExtractor={item => item.id}
/>

dataSource.push({
  // each section just has one list item that is the full list item
  data: [
    listItem,
  ],
  key: keyId,
  title: listItem.address
  })



//在“renderItem”调用中使用一个“TouchableOpacity”渲染整个项目`
此.onPressOrder（item.id）}>
{item.inspector}
{项目.检查日期}
... 等
}
renderSectionHeader={（{section:{title}}}）=>(
{title}
)}
节={this.state.dataSource}
keyExtractor={item=>item.id}
/>
dataSource.push({
//每个部分只有一个列表项，它是完整的列表项
数据：[
列表项，
],
key:keyId，
标题：listItem.address
})

<SectionList
  renderItem={({item, index, section}) =>
  // render the entire item in the `renderItem` call with one `TouchableOpacity`
  <TouchableOpacity onPress={ () => this.onPressOrder(item.id) }>
    <View>
      <Text>
      {item.inspector}
      </Text>
    </View>
     <View>
      <Text>
      {item.inspection_date}
      </Text>
    </View>
    ... etc.
  </TouchableOpacity>
}
  renderSectionHeader={({section: {title}}) => (
    <Text style={{fontWeight: 'bold'}}>{title}</Text>
  )}
  sections={this.state.dataSource}
  keyExtractor={item => item.id}
/>

dataSource.push({
  // each section just has one list item that is the full list item
  data: [
    listItem,
  ],
  key: keyId,
  title: listItem.address
  })