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

素颜马尾好姑娘i 2021-07-24 18:34 283阅读 0赞

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)
    	   },
    	 })