如何在使用react native error boundary时返回上一个屏幕?

mklgxw1f  于 2023-06-24  发布在  React
关注(0)|答案(1)|浏览(142)

我在react native中使用错误边界,在遇到错误并显示回退UI后,我想通过使用react native导航按下返回按钮返回到上一个屏幕。如何做到这一点?
这是我的fall back ui:

import {
    Text,
    View,
    TouchableOpacity,
} from 'react-native';
import React from 'react';
import GoBack from '../../../../../../libs/common/src/lib/Assets/Images/Findings/chevron-left.svg';
import { useNavigation } from '@react-navigation/native';

const ErrorFallback = ({ error, resetError, navigation }) => {
    
    console.log('-----', navigation)
    return (
        <View style={{ margin: 20, marginTop: 20 }}>
            <TouchableOpacity onPress={() => navigation.goBack()}>
                <GoBack height={30} width={20} style={{ backgroundColor: "black", color: 'black' }} />
            </TouchableOpacity>
            <View style={{ margin: 0 }}>
                <Text style={{ fontSize: 20, marginTop: 10, color: 'red' }}>Error occurred:</Text>
                <Text style={{ fontSize: 18 }}>{error.message}</Text>
            </View>
        </View>
    );
};

export default ErrorFallback;

目前我不能回到上一个屏幕上使用后退按钮,因为console.log(导航)显示undefined.

c0vxltue

c0vxltue1#

您可以使用useNavigation作为

const navigation = useNavigation();

并从ErrorFallback组件声明中移除导航属性
更改后立即尝试

相关问题