React forwardRef - 類型 IntrinsicAttributes 上不存在屬性

Question

我對ref有疑問。

我的組件：

type DateInputProps = {
  label?: string;
  name: string;
  defaultValue: Date | null;
  maxDate?: Date;
  minDate?: Date;
  noMargin?: boolean;
  forwardRef?: React.RefObject<HTMLInputElement>;
  onChange: (date: Date | null) => void;
};

export const DateInput: FC<DateInputProps> = forwardRef<HTMLInputElement, DateInputProps>(
  ({ defaultValue, label, name, noMargin = false, maxDate, minDate, forwardRef, onChange, ...props }, ref) => {

...

  const CustomInput = ({ value, onClick }: { value?: Date; onClick?: () => void }) => (
      <Input
        ref={ref}
        name={name}
        defaultValue={value}
        onBlur={onBlur}
        alignment={InputAlignment.Right}
        iconRight={{ onClick, icon: 'calendar' }}
        iconLeft={value ? { icon: 'close', onClick: () => setDateValue(null) } : undefined}
      />
    );

...

我收到以下錯誤：

error TS2322: Type '{ ref: (ref: HTMLSelectElement | HTMLInputElement | HTMLTextAreaElement | CustomElement<Record<string, any>> |... 12 more... | null) => void; ... 4 more...; maxDate: Date | undefined; }' is not assignable to type 'IntrinsicAttributes & DateInputProps & { children?: ReactNode; }'.

Property 'ref' does not exist on type 'IntrinsicAttributes & DateInputProps & { children?: ReactNode; }'.

我也嘗試將forwardRef作為屬性 - 結果相同。

反應版本：16.14.0

Answer 1

解決方案： react.ForwardedRef<HTMLInputElement>