React.PureComponent helper, with which the component uses a shallow prop comparison to determine whether to re-render, which in turn prevents unnecessary re-rendering.
import{PureView}from'hydux-react'
exportfunctionView(props){
return(
<PureViewstateInUse={props}> // The props passed to PureView would be shallow compared and determine whether diff and render child components.
{(props)=><ChildComponent{...props}/>} // here we pass function as children to avoid executing child components' render function.
</PureView>
)
}
ErrorBoundary
We can use the ErrorBoundary component to catch children's error, which requires a React 16 feature.
import{ErrorBoundary}from'hydux-react'
exportfunctionView(props){
return(
<ErrorBoundary
report={(error,errorInfo)=>void}// Custom error handler function
renderMessage={(error,errorInfo)=>React.ChildNode}// Custom error message renderer, default is `return null`
>
{()=><ChildComponent{...props}/>} // here we pass function as children to catch errors in child components' render function.