我有一個存在頁面組件和嵌套子組件的 vue 應用程式，它發出異步后請求。如果請求失敗，則會引發錯誤，該錯誤會傳播到頂部組件 ( Page.vue)。errorCaptured這個頂級組件使用-Lifecycle 掛鉤處理其子組件的所有錯誤。這是關于stackblitz的一個作業示例
該機制作業正常，我的應用程式沒有顯示任何警告。但是，我想測驗用 jest 和 vue-test-utils隔離的子組件。因此，我做了一個測驗：
import { mount } from "@vue/test-utils";
import Child from "./Child";
jest.mock("./api", () => ({
createSomething: jest.fn(),
}));
it("creation is erroneous", async () => {
const wrapper = mount(Child);
createSomething.mockImplementation(() => {
throw new Error("error");
});
let createAction = wrapper.find("[data-test-create]");
await createAction.trigger("click");
});
但是，由于錯誤被重新拋出并且從未被父組件捕獲，所以在我的測驗輸出中總是有一個控制臺日志陳述句：
console.warn
[Vue warn]: Unhandled error during execution of native event handler
at <Child ref="VTU_COMPONENT" >
at <VTUROOT>
我該如何解決這個問題？我試圖包裝await createAction.trigger("click");，try/catch但它不作業。我是否需要模擬我父母的 errorCaptured 生命周期？
uj5u.com熱心網友回復：
app.config.errorHandler一種解決方案是通過global.config安裝選項設定無操作：
const wrapper = mount(Child, {
global: {
config: {
errorHandler(err) { /* ignore */ },
},
},
})
演示
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/461779.html