React -将元素作为prop传递给调用函数的组件

Question

我有以下函数

const renderFooter = () => <View />

FlatList组件有一个道具"ListFooterComponent"，它的定义是:

ListFooterComponent?: React.ComponentType<any> | React.ReactElement<any, string | React.JSXElementConstructor<any>>

如果我执行以下操作

return <FlatList ListFooterComponent={renderEmptyListItem} />

但是如果我做了

return <FlatList ListFooterComponent={renderEmptyListItem()} />

也可以

哪条路是正确的?两者的区别是什么?

Answer 1

第一个将传递一个指针给你的函数，并让FlatList为你触发它。

在第二个示例中，您在组件挂载时自己调用该函数。

第一个选项是正确的，因为您让组件在用户滚动到列表底部时处理它，而在第二个示例中，它将立即被调用。