使用react-router

Question

我在一些组件中包装了一个用于处理错误的函数，我们称它为：wrapError。

这里有一些要点：

• 某些组件调用端点以获取信息。
• 我正在使用react-router

一切正常，但这里有一个极端的例子：

当用户的访问令牌到期时，用户可以单击并转到另一个页面（组件），新组件将尝试调用其端点，然后由于该令牌无效，我们将收到401错误，最后请记住，我们有wrapError可以处理此错误代码。

此错误是通过使用push中的react-router（导致401页错误）来处理的，但是push是异步的，因此组件上的代码保持运行状态并提示控制台中的错误。

您知道我如何停止流量，并重定向到401屏幕吗？

function wrapError(callback, errorCode = 401) {
  return callback.catch(e => {
    if (errorCode === error.statusCode) {
      // delete access token

      history.push("/my401page");
... etc 

错误是：

TypeError: Cannot read property 'variable' of undefined...

因为那一刻端点返回undefined。

Answer 1

它与反应无关。

Cannot read property 'variable' of undefined...

这意味着您想访问对象的属性。但对象未定义。 在您的示例中，您捕获到错误为e，但您将其用作error。

尝试一下：

function wrapError(callback, errorCode = 401) {
  return callback.catch(e => {
    if (errorCode === e.statusCode) {
      // delete access token

      history.push("/my401page");
... etc