react-navigation 防止应用程序在发布版本中崩溃答案

【问题标题】：react-navigation preventing application from crash in release buildreact-navigation 防止应用程序在发布版本中崩溃
【发布时间】：2018-11-10 07:49:02
【问题描述】：

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

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

代码组件 2：

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

在开发过程中，我得到一个正常的“死亡红屏”，它告诉我“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>
            )
        }
    }
}

附加信息：

当我将组件 2 用作最初调用的组件时，我的应用程序确实会按预期崩溃。它似乎只是在导航后不会崩溃。
行为与 StackNavigator 相同

版本：

反应：16.3.1
ReactNative：55.4
ReactNavigation：尝试使用 1.6.0 和 2.18.2
错误：2.12.4

【问题讨论】：

标签： android react-native react-navigation bugsnag

【解决方案1】：

对于任何有同样问题的人。它与 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()
            }
        ]
    );
};

【讨论】：