reactjs - 在 react native 中按后退按钮时从通知屏幕刷新上一个屏幕

Question

我是 react 原生世界的新手。我有两个屏幕 1)。家2)。通知我正在从主页导航到通知屏幕。当我在通知屏幕中时，当我按后退按钮时，我想刷新主屏幕。请提出建议。

提前致谢!

Answer 1

您能给我们提供更多详细信息吗？您是否使用像react-navigation这样的导航器？如果你想从子组件触发父组件的方法，你应该使用 props。

因此，如果您自己管理 View ，则可以执行以下操作:

export default class Wrapper extends Component
{
    state = {screen: 'Home'}

    useNewScreen = screenToUse => this.setState({screen: screenToUse})
    reloadHome = () => yourFunctionToRefreshThePage

    render = () =>
    {
        if (this.state.screen === 'Home')
            return (<Home goToNotif={() => this.useNewScreen('Notif')} />);
        else if (this.state.screen === 'Notif')
            return (<Notif onGoBack={() => this.reloadHome()} />);
    }
}

class Home extends Component
{
    render = () =>
    {
        return (
            <TouchableOpacity onPress={() => this.props.goToNotif()}/>
        );
    }
}
class Notif extends Component
{
    render = () =>
    {
        return (
            <TouchableOpacity onPress={() => this.props.onGoBack()}/>
        );
    }
}

如果你使用react-navigation，你可以使用相同的想法:您使用特殊 Prop 导航到新页面

this.props.navigation.navigate('Notif', {
    onGoBack: () => this.refresh()
});

当你想返回时，可以调用这个方法

this.props.navigation.state.params.onGoBack();
this.props.navigation.goBack(null);

我希望这足够清楚:)