For example, consider the following code :
const useCustomRef = initialValue => useRef(initialValue);
const CustomComponent = () => {
const ref1 = useRef();
const ref2 = useCustomRef();
useEffect(() => {
ref2.current.otherRef = ref1.current;
}, []);
return <div>Ref test</div>;
};
(Note: Nevermind the silliness, here, this is only to make point.)
Now, importing (and rendering) this dummy component in an app running with react-scripts will print in the console :
path/to/dummy/component.jsx
Line 70:7: React Hook useEffect has a missing dependency: 'ref2'. Either include it or remove the dependency array react-hooks/exhaustive-deps
Is that warning built-in, or is it possible to specify a hooks' immutable properties?
For example, certain hooks return immutable and immutable properties, like :
const ref = useRef(); // immutable
const handleCallback = useCallback(() => {}, []); // mutable
const [ value, setValue ] = useState(); // mutable, immutable
const [ state, dispatch ] = useReducer(...); // mutable, immutable
...
So, can a user-defined hook define the same properties so that they are not required as dependencies? I find it annoying to implement custom hooks returning immutable properties that are, then, required as dependencies while they would not otherwise (like for ref2 in the example above).
eslint-plugin-react-hooks, it just has "tribal knowledge" about which values are guaranteed stable...