我正在使用 React Native 制作社交网络应用程序。用户可以拍照，单击保存按钮以将图像 uri 作为 prop 传递到保存屏幕。这是代码 -

App.js

const store = createStore(rootReducer, applyMiddleware(thunk))

const Stack = createStackNavigator()

export default function App() {

    const [loading, setLoading] = useState(false)
    const [loggedIn, setLoggedIn] = useState(false)

    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

    return (
        <Provider store={store}>
            <NavigationContainer>
                <Stack.Navigator initialRouteName="HomeScreen">
                    <Stack.Screen
                        name="HomeScreen"
                        component={HomeScreen}
                        options={{headerShown: false}}
                    />
                    <Stack.Screen
                        name="CreatePostScreen"
                        component={CreatePostScreen}
                        options={{title: "New Post!"}}
                        navigation={this.props.navigation}   //error line
                    />
                    <Stack.Screen
                        name="SaveImageScreen"
                        component={SaveImageScreen}
                        options={{title: ""}}
                    />
                </Stack.Navigator>
            </NavigationContainer>
        </Provider>
    )
}

CreatePostScreen.js

function CreatePostScreen({navigation}) {

    const [hasCameraPermission, setHasCameraPermission] = useState(null)
    const [hasGalleryPermission, setHasGalleryPermission] = useState(null)
    const [type, setType] = useState(Camera.Constants.Type.back)
    const [camera, setCamera] = useState(null)
    const [image, setImage] = useState(null)

    useEffect(() => {
        ~~~~~~~~~~~~~~~
    }, [])

    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

    const takePicture = async () => {
        if (camera) {
            const data = await camera.takePictureAsync(null)
            setImage(data.uri)
        }
    }    

    return (
        <View style={{flex: 1}}>
                ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~`
                <IconButton
                    icon="radiobox-marked"
                    color={Colors.SEA_BLUE}
                    size={35}
                    onPress={() => takePicture()}
                />
                <IconButton
                    icon="check-circle"
                    color={Colors.SEA_BLUE}
                    size={35}
                    onPress={() => navigation.navigate("SaveImageScreen", {image})} //saved image uri is passed to another screen as prop   
                />
            </View>
            ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
        </View>
    )
}

CreatePostScreen 和 SaveImageScreen 都是 App.js 中导航容器下的堆栈屏幕。

但每当我运行应用程序时，我都会收到此错误 ~

TypeError: Cannot read properties of undefined (reading 'props')

或者，有时是这个错误 ~

TypeError: undefined is not an object (evaluating 'this.props')

我应该在代码中做哪些更改？