反应导航防止应用程序在发布版本中崩溃

react-navigation preventing application from crash in release build

我的 react-native 应用程序有一个非常奇怪的行为。我追踪到一个最小的例子。

我有一个带有两个组件的 SwitchNavigator。第一个组件除了在 2000 毫秒后导航到第二个组件外什么都不做。第二个组件在渲染方法中有一个错误(例如它试图渲染一些未定义的东西"test.error")。

代码组件 2:

render = () => {
    return (
        <View>
            {
                test.error
            }
        </View>
    )
}

在开发过程中,我得到一个正常的 "redscreen of death",它告诉我 "ReferenceError: ReferenceError: test is not defined"。这是预期的行为。 但在发布版本中,应用程序静默失败,只显示一个空白屏幕。没有应用程序崩溃。

更多信息: 相同的应用程序确实在发布版本中崩溃(如预期的那样),当在组件安装后显示错误部分时。

组件 2 - 按预期崩溃:

class Test extends Component {
    state = {
        error: false
    };

    componentDidMount = () => {
        setTimeout(() => {
            this.setState({error: true});
        }, 0)
    };

    render = () => {
        if (this.state.error) {
            return (
                <View>
                    {
                        test.error
                    }
                </View>
            )
        } else {
            return (
                <View>
                    Test
                </View>
            )
        }
    }
}

附加信息:

版本:

对于遇到同样问题的任何人。它与 bugsnag 或 react-navigation 无关。

问题是,渲染方法中的错误不会使应用程序在发布模式下硬崩溃。我认为原因在于 React 16 和 ErrorBoundary 特性。

我的解决方案是在我的 App.js 中添加一个 ErrorBoundary(参见 https://reactjs.org/docs/error-boundaries.html)。在这里,我现在能够处理错误并将其报告给 bugsnag。

componentDidCatch = (e, message) => {
    bugsnag.notify(e);
    Alert.alert(
        I18n.t('GLOBAL__FATAL_ERROR'),
        I18n.t('GLOBAL__FATAL_ERROR_MESSAGE'),
        [
            {
                text: I18n.t('GLOBAL__FATAL_ERROR_RESTART'),
                onPress: () => BackHandler.exitApp()
            }
        ]
    );
};