Реакция наложения ошибок - показать для одной ошибки, а затем выдать другую для вызова кода - PullRequest
0 голосов
/ 11 марта 2019

В настоящее время у меня есть приложение реагирования, в котором есть некоторые асинхронные функции, связанные с действиями с избыточностью.Все эти действия заключены в эту функцию Act, чтобы гарантировать, что любые непредвиденные ошибки регистрируются, и более удобная для пользователя ошибка отправляется в код пользовательского интерфейса, который затем отображает ее пользователю.

export function Act<R>(
    callback: (dispatch: Dispatch, getState: () => ReduxState) => Promise<R>
): typeof callback {
    return async (dispatch, getState) => {
        try {
            // if the callback works fine, just return it's value
            return await callback(dispatch, getState);
        } catch (e) {
            if (e instanceof UserError) {
                // we are expecting the action to throw these, although should still be logged
                console.log(`async callback threw user error: ${e}`);
                // propogate to UI code.
                throw e;
            } else {
                // Some exception happened that wasn't expected, log a traceback of the error
                console.trace(`Error in Async Action: ${e}`);
// HERE IS WHERE I WANT TO IMPROVE ^
                // since the error thrown will likely be shown to the user just show a generic message
                throw new UserError('something went wrong');
            }
        }
    };
}

Этоработает нормально, хотя иногда мне не хватает console.trace, чтобы понять, что что-то пошло не так, чего я не ожидал, либо потому, что ошибка никогда не приводит к интерфейсу, либо

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

Я пытался использовать reportRuntimeError изреакция-ошибка-наложение, но я, очевидно, неправильно импортировал его, поскольку он был зарегистрирован как undefined:

import { reportRuntimeError } from 'react-error-overlay'; // didn't work and couldn't find type definitions for the module

Я попытался npm install @types/react-error-overlay, который не смог найти определения типа для этого модуля иЯ не уверен, является ли это правильным местом, чтобы пытаться сделать это.

Есть ли способ показать ошибку, которая была первоначально выдана, а затем повторитьили другой, который будет обрабатываться кодом пользовательского интерфейса?

1 Ответ

0 голосов
/ 11 марта 2019

Я понял примерно на полпути, написав мой вопрос, что React показывает оверлей для Обещаний, которые выдают ошибку, которая никогда не обрабатывается, поэтому мне просто нужно было сделать обещание, которое выдало ошибку, которую я хочу показать, и нигде не обрабатывать ее :

else {
    // This gets logged as an Unhandled Promise Rejection
    // so React will show the overlay for it as well.
    void Promise.reject(e);
    throw new UserError(fallbackErrorMessage);
}
...