为什么我们需要在 React Native 中的 FlatList 的 renderItem() 方法中使用大括号答案

【问题标题】：Why we need braces in renderItem() method for FlatList in React Native为什么我们需要在 React Native 中的 FlatList 的 renderItem() 方法中使用大括号
【发布时间】：2021-07-22 01:26:45
【问题描述】：

我不确定为什么我们在下面的代码 sn-p 中需要 item 之外的大括号，而对于 keyExtractor 没有大括号。我猜这与对象解构有关，但这里的item 指的是什么？ friends对象中没有名称为“item”的字段，怎么可能是对象解构？

import React from 'react';
import {View, Text, StyleSheet, FlatList}  from "react-native";

const ListScreen = () => {
    const friends = [
        {name: "friend #1"},
        {name: "friend #2"},
        {name: "friend #3"},
        {name: "friend #4"},
        {name: "friend #5"},
    ];

    return (
        <View>
            <Text>This is the ListScreen Component</Text>
            <FlatList
                keyExtractor={(friend) => friend.name}
                data={friends}
                renderItem={({item}) => {
                    return <Text>{item.name}</Text>
                }}
            />
        </View>
    );
}

【问题讨论】：

标签： javascript reactjs react-native react-native-flatlist

【解决方案1】：

传递给renderItem的参数是一个表单对象

{ item, index, separators }

大括号允许您解构参数并直接访问item 字段。

签名由 FlatList 组件的实现定义。如果你想看看它是什么样子的，你可以在 React Native 存储库中找到它。

【讨论】：