传入一个解构的对象？

Question

const FlatListBasics = () => {
  return (
    <View style={styles.container}>
      <FlatList
        data={[
          {key: 'Devin'},
          {key: 'Dan'},
          {key: 'Dominic'},
          {key: 'Jackson'},
          {key: 'James'},
          {key: 'Joel'},
          {key: 'John'},
          {key: 'Jillian'},
          {key: 'Jimmy'},
          {key: 'Julie'},
        ]}
        renderItem={({item}) => <Text style={styles.item}>{item.key}</Text>}
      />
    </View>

所以今天在阅读 React Native 文档时，我遇到了这段代码，我们实际上是在其中传递了一个{item}已解构的。
我确实阅读了一些关于解构的内容，我知道它是如何工作的，但我不明白我们是如何将它作为解构传递给函数的，以及我们为什么要这样做。

Answer 1

我不明白我们是如何将它作为解构传递给函数的

它没有被解构传递。它在接收时被函数解构。这段代码：

renderItem={({item}) => <Text style={styles.item}>{item.key}</Text>}

设置renderItem为一个函数。该函数接受一个参数，使用解构来挑选它的item属性。就像这样：

renderItem={(obj) => <Text style={styles.item}>{obj.item.key}</Text>}