28 lines
611 B
TypeScript
28 lines
611 B
TypeScript
|
import { useMemo, useRef, useState } from 'react';
|
||
|
|
|
||
|
|
const CURRENT_FIELD = 'current';
|
||
|
|
|
||
|
|
const useReactiveRef = <T = unknown>(initialValue: T | null) => {
|
||
|
|
const [current, setCurrent] = useState<T | null>(null);
|
||
|
|
const ref = useRef<T | null>(initialValue);
|
||
|
|
|
||
|
|
const proxy = useMemo(
|
||
|
|
() => new Proxy(ref, {
|
||
|
|
set(target, field, newValue, receiver) {
|
||
|
|
if (field === CURRENT_FIELD) {
|
||
|
|
setCurrent(newValue);
|
||
|
|
}
|
||
|
|
return Reflect.set(target, field, newValue, receiver);
|
||
|
|
},
|
||
|
|
}),
|
||
|
|
[],
|
||
|
|
);
|
||
|
|
|
||
|
|
return {
|
||
|
|
ref: proxy,
|
||
|
|
current,
|
||
|
|
};
|
||
|
|
};
|
||
|
|
|
||
|
|
export default useReactiveRef;
|