有多种方法可以实现这一点，@yousoumar有一个非常有效的方法。
其他一些：
1.将onPressListHandler传递给组件。

const onPressListHandler = (id) => {};

const renderItem = ({ item }) => listRenderItem(item, onPressHandler);

return (
  <FlatList
    renderItem={renderItem}
  />
)

// 
const listRenderItem = (item, onPress) => {
  // Now you can call onPress(item.id);
}

1.将listRenderItem放入ListsList组件中。

const ListsList = () => {
  const onPressListHandler = (id) => {};

  const listRenderItem = ({ item }) => {
    // You can call `onPressListHandler(item.id)` here.
  }

  return (
    <FlatList
      renderItem={listRenderItem}
    />
  )
}

我个人在这里选择第二个选项，但我很想知道为什么渲染函数在组件之外。

例如，您可以通过在listRenderItem内部处理重定向来执行以下操作：

import { useNavigation } from '@react-navigation/native';

const listRenderItem = ({ item }) => {
    const {navigation} = useNavigation();
    return (
        <Pressable onPress={() =>  navigation.navigate('ListDetailScreen', { listId: item.id })} >
            <Text _dark={{ color: "warmGray.50" }} color="coolGray.800">
                {item.listName}
            </Text>
            <Icon as={Ionicons} name="chevron-forward-outline" size="sm" />
        </Pressable>
    )
};

const ListsList = () => {
    
    // Render
    return (
        <FlatList
            data={lists}
            renderItem={listRenderItem}
            keyExtractor={item => item.id}
        />
    );

function MainScreen({ navigation }) {
    // ...
    // Render
    return (
            <ListsList />
    );
}

export default MainScreen;