react-query 查询错误边界处理

让查询知道您希望在发生某些错误后重新呈现时再次尝试

(1)错误边界组件使用react-error-boundary
	cnpm install -D react-error-boundary
	
	import { ErrorBoundary } from 'react-error-boundary'
	
(2)使用reset处理查询错误
	方式一:当使用组件时,它将重置组件边界内的任何查询错误
	
	   import { QueryErrorResetBoundary } from 'react-query'
	   
	   <QueryErrorResetBoundary>
	     {({ reset }) => (
	       <ErrorBoundary
	         onReset={reset}
	         fallbackRender={({ resetErrorBoundary }) => (
	           <div>
	             There was an error!
	             错误发生时,调用resetErrorBoundary()方法,可以触发onReset回调
	             <button onClick={() => resetErrorBoundary()}>Try again</button>
	           </div>
	         )}
	       >
	         <Page />
	       </ErrorBoundary>
	     )}
	   </QueryErrorResetBoundary>

方式二:使用useQueryErrorResetBoundary钩子
	当使用该钩子时,它将重置最近的QueryErrorResetBoundary内的任何查询错误,如果没有定义边界,它将全局重置它们:
	
 		 const { reset } = useQueryErrorResetBoundary()
 		 
	     <ErrorBoundary
	       onReset={reset}
	       fallbackRender={({ resetErrorBoundary }) => (
	         <div>
	           There was an error!
	           错误发生时,调用resetErrorBoundary()方法,可以触发onReset回调
	           <Button onClick={() => resetErrorBoundary()}>Try again</Button>
	         </div>
	       )}
	     >
	       <错误组件 />
	     </ErrorBoundary>