如何讓反應電子忽略未定義的錯誤？

Question

在Windows上反應電子，如果A為空，則調用A.test將使應用程序停止工作，然后用戶必須關閉應用程序並重新啟動它。 如何讓react忽略錯誤，並繼續工作。 代碼有很多A.test ， if(A) A.test ，我無法到處寫。 如果無法解決此問題，我可以在Web視圖上打印錯誤嗎？ 所以我沒有遠程訪問用戶的計算機來查看控制台錯誤。

Answer 1

注意

我認為解決方案是使用反應錯誤邊界 ，如控制台中所建議的那樣。

您已經指出您正在使用錯誤邊界，因此在使用此小提琴測試您的方案后，我認為您的實現可能不正確。

---

給出了文檔中ErrorBoundary的類似實現：

class ErrorBoundary extends React.Component {
  state = { hasError: '' };
  render() {
    return this.state.hasError ? (
      <span>Oops! Something went wrong:<br />{this.state.hasError}</span>
    ) : this.props.children;
  }
}
ErrorBoundary.getDerivedStateFromError = (error) => ({ hasError: error.toString() });

該組件將呈現回落時，其所有子打破。

錯誤邊界是React組件，它們在其子組件樹中的任何位置捕獲JavaScript錯誤，記錄這些錯誤並顯示回退UI

它看起來類似於：

<MyReactApp>
  <ErrorBoundary>
    <ChatContent />
  </ErrorBoundary>
</MyReactApp>

現在，在任何錯誤ChatContent將漁獲ErrorBoundary讓您有機會來呈現，如回退：

Oops! Something went wrong:
ReferenceError: test is not defined

Answer 2

這是很難提供一個回答你的問題，因為我沒有看到你的項目代碼，但如果你的反應的版本是16，你可以使用一個特殊組件的生命周期方法，它的名字是componentDidCatch 。

在此方法中，您將擁有以下值：

componentDidCatch(error, info) {
  // Do something with error and info
}

即使你可以在這個方法中使用setState並顯示你想要的。 我認為這種方法可以幫助您滿足您的第二個願望，即Web視圖中的打印error 。

Answer 3

代碼有很多A.test，如果（A）A.test，我不能寫每個地方

但為什么？ 您可以使用某些編輯器進行多文件編輯。 所以，你可以替換A.test()來safeTest(A)功能。

export const safeTest = (Obj) => {
 if (Obj) {
  Obj.test();
 } else {
  // Any action you want
 }
}

Answer 4

我傾向於使用默認道具 。 如果在未定義的情況下傳遞prop，則可以為要分配給prop的組件設置一個值。 例如，如果組件依賴於嵌套在對象中的數組，則默認情況下可以將該值設置為空數組。 當您的組件依賴於API調用的結果數組時，這尤其方便，但組件在請求完成之前呈現。

Answer 5

如果你想盡可能少地捕獲 Electron中主要和渲染器進程中的所有未處理錯誤 ，並通過對話框向用戶顯示它們 ，那么簡單的方法就是使用電子未處理的錯誤來完成：

安裝它（ npm i electron-unhandled ）之后，在你的主文件和渲染器條目文件（可能是它們的根index.js ）中，你只需要在開頭添加：

const unhandled = require('electron-unhandled');

unhandled({ showDialog: true });

現在，正如所說的那樣，使用全局錯誤捕獲器是一個好習慣，但如果只使用它，那就非常糟糕。 您應該嘗試更准確地覆蓋錯誤處理，至少方法是：

• .then() { ... }.catch(err => ...)為你的承諾，
• (..., (err, res) => { if (err !== null) { ... } ... )為你的回調，
• 對於非異步或基於await的代碼部分try { ... } catch(err) { ... } 。

而且，作為附注，我自己創建了一個依賴性庫 ，以便安全，輕松地創建全局錯誤字典，以便很好地組織您的錯誤，但如果這個不適合您的需求，還有其他選擇。

Answer 6

我想最好的解決辦法是圍繞你的A.test try和catch 。 在這種情況下，你可以做的是catch錯誤是A是null並從你的身邊執行一些錯誤頁面你想要它或只是保持錯誤沉默，因為你不想執行任何操作並抑制錯誤並繼續執行。

您還可以使用try-catch將A.test包裝在一個函數中，並使用該函數代替A.test 。 通過這種方式，您可以避免多個try-catch塊，並且可以根據您的要求處理錯誤。