diff --git a/docs/rules/jsx-no-bind.md b/docs/rules/jsx-no-bind.md index e44321e79f..12128ee5c6 100644 --- a/docs/rules/jsx-no-bind.md +++ b/docs/rules/jsx-no-bind.md @@ -37,7 +37,7 @@ When `true` the following are **not** considered warnings: ```jsx
console.log("Hello!")} /> - + ); +}; +``` + +Otherwise, the idiomatic way to avoid redefining callbacks on every render would be to memoize them using the [`useCallback`](https://reactjs.org/docs/hooks-reference.html#usecallback) hook: + +```jsx +const Button = () => { + const [text, setText] = useState("Before click"); + const onClick = useCallback(() => { + setText("After click"); + }, [setText]); // Array of dependencies for which the memoization should update + return ( + + ); +}; +``` + ## When Not To Use It If you do not use JSX or do not want to enforce that `bind` or arrow functions are not used in props, then you can disable this rule.