覆盖后退按钮wix对本机导航V2有反应吗?

时间:2019-04-05 02:30:11

标签: android react-native wix-react-native-navigation

我目前正在从Wix RNN V1过渡到V2,到目前为止,除了覆盖Android上的后退按钮之外,我已经设法找到了合适的替代API。

在V1中,我们可以传递overrideBackPress: true属性,然后在对应的屏幕上手动处理后退按钮。

但是,在V2中,我没有找到这样的替代品,而我唯一能找到的主题就是这个线程:

https://github.com/wix/react-native-navigation/issues/4217

我已经在这里实施了建议,但是Wix导航仍然会自动关闭屏幕,即使它应该被覆盖。

有什么解决方案吗?

2 个答案:

答案 0 :(得分:0)

我遇到了同样的问题,我可以在两个平台上覆盖backpress行为的唯一方法是用自定义按钮替换左后退按钮,并对Android中的硬件按钮使用react native的BackHandler。代码如下。

组件A

//Navigate to component B from A
Navigation.push(this.props.componentId, {
component: {
    name: 'ComponentB',
    options: {
        topBar: {
            leftButtons: [{
                id: 'backPress',
                text: 'Back',
                icon: require('backbutton.png')
            }]
        },
    }
}
});

组件B

import React, { PureComponent } from 'react';
import { View, BackHandler } from 'react-native';
import { Navigation } from 'react-native-navigation';

export default class ComponentB extends PureComponent {

constructor(props) {
    super(props);
    Navigation.events().bindComponent(this);
}

componentDidMount() {
    BackHandler.addEventListener('hardwareBackPress', this.handleBackPress);
}

componentWillUnmount() {
    BackHandler.removeEventListener('hardwareBackPress', this.handleBackPress);
}

navigationButtonPressed({ buttonId }) {
    switch (buttonId) {
        case 'backPress': {
            this.handleBackPress();
            break;
        }
    }
}

handleBackPress = () => {
    //Custom logic

    //Go back if required
    Navigation.pop(this.props.componentId)

    //Stop the default navigation
    return true;
};

//Render component
render() {
    return (<View></View>);
}
}

答案 1 :(得分:0)

您可以使用registerScreenPoppedListener

Navigation.events().registerScreenPoppedListener((event) => {
    if (event.componentId === "my-screen-id") {
        // do something
    }
});