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

Question

I'm trying to pass a parameter (item, which is a data item within a FlatList) to an arrow function within a prop. Popover is a react-native-ui-kitten element. My code is given below:

    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>
        )
    };

The issue here is that item is undefined within the arrow function declared as the anchor prop. What is the proper solution here?

Answer 1

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

OR

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

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