2016-04-29 73 views
0

我已經在寫了下面的函數來呈現一個錯誤頁面,當頂層容器我希望呈現遇到錯誤:爲什麼ReactJS不捕獲子組件的呈現異常?

function unsafeRender(callback) { 
    try { 
    var renderedComponent = callback(); 
    return renderedComponent; 
    } catch(err) { 
    return (<ErrorPage error={err} />); 
    } 
} 

頂層容器有這種方法稱爲其render()方法:

render: function() { 
    return unsafeRender(function() { 
    return <Component />; 
    }); 
} 

<Component />的渲染方法引發錯誤時,它不會被unsafeRender函數捕獲。只有當我直接將它應用到組件時,該方法纔會被調用。源代碼見this fiddle

爲什麼會出現這種情況,我是否真的必須將這種方法應用於每個子組件才能使其工作,而不是隻能在頂層容器中使用它?

+1

請參見[錯誤邊界:從'render'#2461](https://github.com/facebook/react/issues/2461)中引發的錯誤中恢復。 –

+0

解釋了很多。謝謝@FelixKling! – maxmantz

回答

0

這是由React中的已知問題引起的。請參閱Felix Kling在我的問題下對Github上關於該問題的鏈接的評論。