Как терпеть неудачу и исключать исключения в React Native?

Question

Когда мое приложение находится в процессе производства, я хотел бы избежать красных ошибок экрана, если произойдет что-то плохое.

Как это сделать, чтобы вместо исключения исключения и отображения экрана ошибки приложение просто перезагрузилось и возвращается на домашнюю страницу?

Answer 1

Для прослушивания конкретных событий вам необходимо иметь прослушиватели и активировать обратный вызов в случае, если кто-либо из этих слушателей выстрелил.

Например, у меня есть слушатель из-за отсутствия подключения к Интернету с использованием NetInfo, а также при открытии/закрытии приложения с использованием AppStateIOS. Моя getInitialState функция устанавливает два свойства:

getInitialState: function() { 
    return { 
     currentState: AppStateIOS.currentState, 
     isConnected: null 
    } 
    }, 

Тогда у меня есть некоторые слушатели и обработчики:

componentWillMount: function() { 
    NetInfo.isConnected.fetch().done(
     (isConnected) => { this.setState({isConnected}); } 
    ); 
    }, 

    componentDidMount: function() { 
    AppStateIOS.addEventListener('change', this.handleAppStateChange); 
    NetInfo.isConnected.addEventListener('change', this.handleConnectivityChange); 

    }, 

    componentWillUnmount: function() { 
    AppStateIOS.removeEventListener('change', this.handleAppStateChange); 
    NetInfo.isConnected.removeEventListener('change', this.handleConnectivityChange); 
    }, 

    handleAppStateChange: function(state) { 
    this.setState({ 
     currentState: state 
    }); 
    }, 

    handleConnectivityChange: function(connection) { 
    this.setState({ 
     isConnected: connection 
    }) 
    }, 

Мой render метод зависит от моего состояния:

render: function() { 
    if (!this.state.isConnected) { 
     return (
     this.renderLoading() 
     ) 
    } 

    return (
     <View style={styles.container}> 
     <WebView url={this.props.url} /> 
     </View> 
    ) 
    }, 

Answer 2

Хотя ответ Ричарда KHO мощи справиться с известными проблемами, он не обеспечит «молчаливый сбой».

Есть несколько инструментов, которые помогут вам поймать все ошибки, такие как react-native-report-error. Тем не менее, это тоже не подведет.

В то же время, несколько шагов помогут вам достичь этого:

1. Всегда инициализировать реквизит/состояние со значениями по умолчанию;
2. Функция обертывания в Promises или try/catch blocks;

Это не волшебство, а работает.