我正在用我从WordPress数据库中得到的一些产品制作一个应用程序。在主屏幕上，我有所有产品的概览，每个产品都在一个磁贴中。我希望能够在每个磁贴中放置一个按钮，链接到特定的产品页面。但是，由于它是与组件一起工作的，我需要能够使用一个 prop 来实现这一点。如果可能的话，还需要基于API的标题。
这是我的代码屏幕上的所有产品：

import React, { useState, useEffect } from 'react';
import { StyleSheet, Text, View, FlatList, Image, Button } from 'react-native';
 
import SuitcaseItem from '../components/SuitcaseItem';
 
const AllSuitcasesScreen = ({ navigation }) => {
 
  const [suitcases, setSuitcases] = useState([]);
 
  const getSuitcases = async () => {
    try {
      const response = await fetch("https://evivermeeren.com/wp-json/wp/v2/posts?categories=59", {
 
        }
      )
      const json = await response.json();
      console.log(json);
      setSuitcases(json);
    } catch (error) {
      console.error(error);
    }
 
  }
 
  useEffect(() => {
    getSuitcases();
  }, []);
 
  return (
    <View style={styles.screen}>

          <View style={styles.flexbox2}>
            <Text style={styles.products}>Onze koffers</Text>
            <View style={styles.shoppingcart}>
              <Image
                  style={styles.icon}
                  source={{uri: 'https://cdn-icons-png.flaticon.com/512/1413/1413908.png'}}
                />
              <Text style={styles.number}>0</Text>
            </View>
          </View>

        <View style={styles.list}>

        <FlatList
        data={suitcases}
 
        renderItem={({ item }) => (
          <SuitcaseItem
          title={item.title.rendered}
          imageUri={{uri: 'https://www.samsonite.be/on/demandware.static/-/Sites/default/dw851ab6f0/images/misc/sams_share-image.jpg'}}
          desc={item.slug}
          buttonText={item.title.rendered}
          />
        )}
      />
      
      </View>
    </View>
  );
}

export default AllSuitcasesScreen;

这就是结果

现在，当我点击黑色按钮时，我会转到“Evo L”页面，这也是我创建的。这是我使用的按钮：

<Pressable style={styles.seeProduct} onPress={() => navigation.navigate("Evo L")}>
          <Text style={styles.text}>Bekijk product: {props.buttonText}</Text>
        </Pressable>

这是在另一个文件中，“SuitcaseItem”。
我应该可以把navigation.navigate("props.buttonNav")和buttonNav = {item.title.rendered}放在一起，这样当我点击它时，它会转到Evo L页面，当我点击它时，它会转到Evo M页面，等等，有人有主意吗？