react-query 自定义查询焦点状态FocusManager、自定义在线状态OnlineManager、自定义输出setLogger

1、自定义焦点事件:
	粗浅理解:自定义焦点后,能根据自定义的焦点获取时,使得react-query能重新获取状态
	
	例子为默认焦点设置:
	import { focusManager } from 'react-query'
	
	focusManager.setEventListener(handleFocus => {
	
	   if (typeof window !== 'undefined' && window.addEventListener) {
	     window.addEventListener('visibilitychange', handleFocus, false)	监听窗口切换
	     window.addEventListener('focus', handleFocus, false)				监听窗口获得焦点事件
	   }
	
	   return () => {	还必须定义清除副作用函数
	     window.removeEventListener('visibilitychange', handleFocus)
	     window.removeEventListener('focus', handleFocus)
	   }
	 })

	手动获取焦点
		focusManager.setFocused(true)
		focusManager.setFocused(undefined)	回退到默认的焦点检查
	
	获取是否被焦点状态
		const isFocused = focusManager.isFocused()	返回当前焦点状态布尔值
	
2、自定义在线状态
	粗浅理解:在线会重启react-query,离线会关掉react-query服务
	
	自定义在线状态:
		 import NetInfo from '@react-native-community/netinfo'
		 import { onlineManager } from 'react-query'

		 onlineManager.setEventListener(setOnline => {	setEventListener自定义在线状态
		   return NetInfo.addEventListener(state => {
		     setOnline(state.isConnected)
		   })
		
		 })
		
	手动设置在线状态
		onlineManager.setOnline(true)
		onlineManager.setOnline(undefined);		回退到默认的在线检查
	
	获取当前在线状态
		const isOnline = onlineManager.isOnline()

3、自定义setLogger
	自定义react-query的输出内容方式,默认情况下使用window.console,如果在环境中没有找到全局控制台对象,则不会记录任何内容。
	 setLogger({
	   log: message => {
	     Sentry.captureMessage(message)
	   },
	   warn: message => {
	     Sentry.captureMessage(message)
	   },
	   error: error => {
	     Sentry.captureException(error)
	   },
	 })

猜你喜欢

转载自blog.csdn.net/weixin_43294560/article/details/115055291