React Native：在屏幕之间传递图像数据

Question

我想通过响应本机将图像的数据（例如url和标题）传递到另一个屏幕， 堆栈导航。 但是当我从清单中选择图像并将所选图像的数据（标题，URL）发送到page2时，我什么也看不到。

这是我的密码

Page1（Walkthrought1）

    /**
 * Sample React Native App
 * https://github.com/facebook/react-native
 *
 * @format
 * @flow strict-local
 */

  
    import React from 'react'
    import {View , Dimensions , FlatList, Text , TouchableOpacity, Image,StyleSheet} from 'react-native'
    import { TouchableHighlight } from 'react-native-gesture-handler'
    import {
      //responsiveheight,
      responsiveWidth,
      responsiveFontSize,
      responsiveHeight,
      } from "react-native-responsive-dimensions";
    const {height , width} = Dimensions.get('window')

    
    export default class Walkthrought1 extends React.Component {
    

      static navigationOptions = ({ navigation }) => {
        const { params ={} } = navigation.state
        }
        constructor(props)
        {
            super(props)


            this.state ={
              products : [
                  {
                    id:'1',
                  title:'Product1',
                  image: require("../../assest/image1.jpg"),
                  },
                  {
                    id:'2',
                    title:'Product2',
                    image: require("../../assest/image2.jpg"),
                  },
                  {
                  id:'3',
                  title:'Product3',
                  image: require("../../assest/image3.jpg"),
                },
                {
                  id:'4',
                  title:'Product4',
                  image: require("../../assest/image4.jpg"),
                },
                {
                id:'5',
                title:'Product5',
                image: require("../../assest/image5.jpg"),
                },
                {
                id:'6',
                title:'Product6',
                image: require("../../assest/image6.png"),
                },
                {
                id:'7',
                title:'Product7',
                image: require("../../assest/image7.jpg"),
                },
                {
                  id:'8',
                  title:'Product8',
                  image: require("../../assest/image8.jpg"),
                },
                {
                id:'9',
                title:'Product9',
                image: require("../../assest/image9.jpg"),
                },
              ]
            
          }
        }
    
        
    
        render() {
          const {navigate} = this.props.navigation;
            return(
             <View>
                 <FlatList
                 data={this.state.products}
                 renderItem={({item})=> {
                     return(
                         <TouchableOpacity 
                         onPress={() => {
                          
                          this.props.navigation.navigate("Page2",{
                            Send_Image:this.props.image,
                            Send_Title:this.props.title, 
                          });
                          
                         //style={styles.touchable}
                          }} >
                             <Image
                                source={item.image}
                                style={styles.images}
                             />
                             <Text style={styles.title}>
                                 {item.title}
                             </Text>
                         </TouchableOpacity>
                     )
                 }}
                 />
    
             </View>   
            )
        }
    }
  
        
      
  const styles = StyleSheet.create({
  
      touchable:{
          height:height*0.14 , flexDirection:'row' , justifyContent:'space-between' , alignItems:"center"
        },
      
  
      title:{
        color:"black",
        textAlign:"center",
        fontSize:14,
      },
  
      images:{
        height:'50%' , width:'30%' , resizeMode:'cover'
      },

      list:{
    },
     
      
    })
  

Page2（Walkthrought2）

    /**
 * Sample React Native App
 * https://github.com/facebook/react-native
 *
 * @format
 * @flow strict-local
 */
import 'react-native-gesture-handler';
import  React from 'react';
import { NavigationContainer } from '@react-navigation/native';
import {
  Image,
  StyleSheet,
  View,
  Text,
} from 'react-native';

import {
    //responsiveheight,
    responsiveWidth,
    responsiveFontSize,
    responsiveHeight,
    } from "react-native-responsive-dimensions";



    
      
export default class Walkthrought2 extends React.Component {
    static navigationOptions = ({ navigation }) => {
    const { params ={} } = navigation.state 
    }
    constructor(props)
    {
        super(props)
    }



render() {

 const Get_Image = (this.props.navigation.getParam("Send_Image"));
  const Get_Title = (this.props.navigation.getParam("Send_Title"));
    return (
      <View>
     <Image style={styles.images} source={global.Get_Image}/>   
      <Text style={styles.title}>{JSON.stringify(Get_Title)}</Text>
  </View>
    );
        
    
}
}
const styles = StyleSheet.create({
    body:{

    },
    title:{
        color:"black",
        textAlign:"center",
        fontSize:responsiveFontSize(5),
      },
  
      images:{
         width:responsiveWidth(40),
         height:responsiveHeight(28),
         
  
      },
    })

App.js

    import React from "react"
import Walkthrought1 from "./Pages/Walkthrought1/Walkthrought1.js"
import Walkthrought2 from "./Pages/Walkthrought2/Walkthrought2.js"

import {createAppContainer} from "react-navigation"
import {createStackNavigator} from "react-navigation-stack"

const PushRouteOne = createStackNavigator({
  Page1: {
    screen: Walkthrought1,
 },
 
 Page2: {
    screen:Walkthrought2,
 },
 /*
 Page3:{
 screen:Walkthrough03,
 },
 Login:  {
 screen:Register,
   }*/
 }, 
 {
  initialRouteName: "Page1",
  mode: "modal",
  headerMode: "none",
  })
  

  const AppContainer = createAppContainer(PushRouteOne)

  export default class App extends React.Component {
  
    render() {
    return <AppContainer/>
    }
  }

我该怎么办，我的代码有问题吗？