prop 中箭头函数中的参数不可访问（React Native）

Question

我正在尝试将参数（item，它是 FlatList 中的数据项）传递给 prop 中的箭头函数。 Popover 是一个 react-native-ui-kitten 元素。我的代码如下：

    function PostRenderItem({ item }){
        const [deleting, setDelete] = useState(false);
        //item is accessible at this point
        return(
                //item is accessible at this point
                <Popover
                visible={deleting}
                anchor={(item) => {
                    return(
                        <Text>{item.content}</Text>
                        //item undefined at this point
                    )
                }}>
                    <Button>Delete me!</Button>
                </Popover>
        )
    };

这里的问题是 item 在声明为 anchor prop 的箭头函数中未定义。这里的正确解决方案是什么？

Answer 1

<Popover
      visible={deleting}
      anchor={() => (
        <Text>{item.content}</Text> /** item is already declared in the upper-scope */
      )}
    />

或

<Popover visible={deleting} anchor={() => renderContent(item)} />

const renderContent = item => <Text>{item.content}</Text>;

prop 中箭头函数中的参数不可访问（React Native）

Parameter within an arrow function within a prop is not accessible (React Native)

javascript

react-native

react-native-ui-kitten