Component() — react Function Reference

Source Code

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-value-in-custom-component-event-handler-wrapper.tsx lines 17–36

function Component() {
  const ref = useRef<HTMLInputElement>(null);

  const onSubmit = (data: any) => {
    // This should error: passing function with ref access to custom component
    // event handler, even though it would be safe on a native <form>
    if (ref.current !== null) {
      console.log(ref.current.value);
    }
  };

  return (
    <>
      <input ref={ref} />
      <CustomForm onSubmit={handleSubmit(onSubmit)}>
        <button type="submit">Submit</button>
      </CustomForm>
    </>
  );
}