什么是渲染行（）

【问题标题】：What is renderRow ()什么是渲染行（）
【发布时间】：2019-02-15 00:32:50
【问题描述】：

我浏览了 React-Native 文档以弄清楚 renderRow() 是什么，但由于某种原因，我无法理解 Facebook React-Native 文档中的内容

这是官方文档所说的

渲染行

(rowData, sectionID, rowID, highlightRow) => 可渲染

从数据源及其 ID 中获取数据条目，并应返回一个可呈现的组件以呈现为行。默认情况下，数据正是放入数据源的内容，但也可以提供自定义提取器。可以通过调用 highlightRow(sectionID, rowID) 来通知 ListView 当一行被突出显示时。这在 renderSeparator 中设置了一个布尔值 SimilarRowHighlighted，允许您控制突出显示行上方和下方的分隔符。可以通过调用 highlightRow(null) 来重置行的突出显示状态。

[问题：]有人可以举例解释一下吗？

【问题讨论】：

标签： react-native

【解决方案1】：

ListView 已弃用，请使用 FlatList 代替等效的 renderItem 方法。这负责根据数据记录实际呈现每一行：

const data = [
  { key: '1', label: 'foo' },
  { key: '2', label: 'bar' }
]

renderTheItem = ({item}) => {
  return <Text>{item.label}</Text>
}

<FlatList
  data={data}
  renderItem={this.renderTheItem}
/>

渲染的结果会是这样的：

<View>   --> coming from FlatList wrapper
 <Text key="1">foo</Text>   --> coming from the custom renderTheItem function
 <Text key="2">bar</Text>
</View>

必须为每个数据记录添加一个唯一的 key prop，或者定义一个keyExtractor 函数。使用({item}) 破坏渲染器函数中的item 也很重要，因为它具有documentation of FlatList 中编写的其他元参数。

renderItem({ item, index, separators}) => {}

【讨论】：