Skip to content

Bug: eslint-plugin-react-hooks shows error for props functions #19829

Closed
@syabro

Description

@syabro

"eslint-plugin-react-hooks": "^4.1.2",

Steps To Reproduce

import React, { useCallback } from 'react'

export function CheckboxField(props) {
  const onChange = useCallback((e) => props.onChange(e.target.checked), [props.onChange])
  return <input type="checkbox" onChange={onChange} />
}

The current behavior

4:73 error React Hook useCallback has a missing dependency: 'props'.
Either include it or remove the dependency array. However, 'props' will change when any prop changes, so the preferred fix is to destructure the 'props' object outside of the useCallback call and refer to those specific props inside useCallback react-hooks/exhaustive-deps

The expected behavior

Error shouldn't be triggered since this code has a correct dependency of props.onChange

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions