reactjs - 处理 mapStateToProps 内应用程序错误的强大方法？

Question

我正在寻找有关处理 mapStateToProps 中错误的最稳健、最可靠方法的建议，以及是否建议在 React+Redux 应用程序中尝试此级别。

例如，如果我将 react-redux 的 connect 与组件和 mapStateToProps 一起使用:

function mapStateToProps(state, ownProps) {
    throw Error('Some unfortunate error.');
    return {
        // some data
    }
}

我想捕获此错误，并可能在渲染组件的位置显示一个错误组件。我不会做出任何恢复的尝试 - 只是继续前进。

目前我注意到这完全停止了 React，并且页面可能需要重新加载:Uncaught TypeError: Cannot read property 'getHostNode' of null

Answer 1

我会将异常作为常规数据处理，因为 connect 仍然期望一些 Prop 将它们传递给您的组件。我会做这样的事情:

function mapStateToProps(state, ownProps) {
 try {
   // code
   return {
       // some data
   }
 } catch (e){
   return {
       error: e
   }
 }
}

然后让组件查找 props.error 并显示错误消息。