ensure-use-callback-has-non-empty-deps
Rule category
Pedantic.
What it does
Warns when useCallback is called with empty dependencies array.
Why is this bad?
React Hooks useCallback has empty dependencies array like what’s in the examples, are unnecessary. The hook can be removed and it’s value can be created in the component body or hoisted to the outer scope of the component.
Examples
Failing
import React, { useCallback } from "react";
function Example() {
// @warn: useCallback has empty dependencies array
const onClick = useCallback(() => {
console.log("clicked");
}, []);
return <button type="button" onClick={onClick} />;
}Passing
import React from "react";
function onClick() {
console.log("clicked");
}
function Example() {
return <button type="button" onClick={onClick} />;
}