bc518174
 王天杨
提交两个项目文件
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
|
import equal from 'fast-deep-equal'
import { useCallback, useState } from 'react'
import { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect.js'
/**
*
* @param monitor The monitor to collect state from
* @param collect The collecting function
* @param onUpdate A method to invoke when updates occur
*/
export function useCollector<T, S>(
monitor: T,
collect: (monitor: T) => S,
onUpdate?: () => void,
): [S, () => void] {
const [collected, setCollected] = useState(() => collect(monitor))
const updateCollected = useCallback(() => {
const nextValue = collect(monitor)
// This needs to be a deep-equality check because some monitor-collected values
// include XYCoord objects that may be equivalent, but do not have instance equality.
if (!equal(collected, nextValue)) {
setCollected(nextValue)
if (onUpdate) {
onUpdate()
}
}
}, [collected, monitor, onUpdate])
// update the collected properties after react renders.
// Note that the "Dustbin Stress Test" fails if this is not
// done when the component updates
useIsomorphicLayoutEffect(updateCollected)
return [collected, updateCollected]
}
|
