React Native 应用程序不会按预期崩溃

Question

我们一直在调查我们的应用程序中的问题，我们只看到白屏并且没有记录崩溃。适用于 Android 和 iOS

该问题似乎与 async/await 或 promises 的使用有关。

我们发现在使用 async/await 或 promises 时，我们可以在本地重现白屏问题。

这个问题可以用下面的代码重现（尽量简化）。将新项目中的 App.js 替换为以下内容：

import React, {Fragment} from 'react';
import {Text} from 'react-native';

class App extends React.Component {
  state = {isMounted: false};

  async componentDidMount() {
    await Promise.resolve(1);
    this.setState({isMounted: true});
  }

  render() {
    if (this.state.isMounted) {
      this.state.isMounted.test();
    }
    return (
      <Fragment>
        <Text>test</Text>
      </Fragment>
    );
  }
}

export default App;

我也在github上推送了一个测试项目

我希望应用程序崩溃，因为isMounted它不包含test方法。

在本地运行时，我得到一个红色框，说明按预期发生了错误

TypeError: this.state.isMounted.test is not a function. (In 'this.state.isMounted.test()', 'this.state.isMounted.test' is undefined)

This error is located at:
    in App (at renderApplication.js:40)
    in RCTView (at View.js:35)
    in View (at AppContainer.js:98)
    in RCTView (at View.js:35)
    in View (at AppContainer.js:115)
    in AppContainer (at renderApplication.js:39)

...

但是在运行发布版本时，应用程序不会崩溃，也不会报告错误。这使我们很难找到并解决此类问题，因为我们完全失明。

如果我注释掉

await Promise.resolve(1);

它在发布版本中按预期崩溃

反应本机版本：0.60.5

我们假设上述代码会导致应用程序崩溃是错误的吗？

Answer 1

发现错误边界是缺失的部分。在根级别实现错误边界允许我们手动将这些错误记录到我们的崩溃处理系统中。

作为旁注，我还可以提到，如果您使用redux-saga并且抛出错误，默认情况下该错误似乎会被吞掉。因此，如果您想处理这些未捕获的错误，您可以onError在中实现该选项createSagaMiddleware