-1

i am trying to upload a file in React / Typescript.

const CSVImport = () => {
  const { isOpen, onOpen, onClose } = useDisclosure();
  const inputFile = useRef(null);

  const onButtonClick = () => {
    // `current` points to the mounted file input element
    inputFile.current && inputFile.current.click();
  };

  return (
    <>
      <Button onClick={onButtonClick}>import CSV</Button>
      <input
        type="file"
        id="file"
        ref={inputFile}
        style={{ display: "none" }}
      />
    </>
  );
};

Problem is, that there is something wrong with inputFile.current.click() -> this is the error:

Property 'click' does not exist on type 'never'.

where do i need to set types?

thank you so much!!

Hannes F
  • 339
  • 2
  • 11
  • Does this answer your question? [Property 'value' does not exist on type 'never'. when use useRef hook in mui](https://stackoverflow.com/questions/61475289/property-value-does-not-exist-on-type-never-when-use-useref-hook-in-mui) – Kapobajza Apr 13 '22 at 09:27

2 Answers2

2

Perhaps you can pass a type to useRef:

const inputFile = useRef<HTMLInputElement>(null);
Sandro
  • 1,051
  • 7
  • 15
0

Here is a link explaining as to why there is an error.

You should define the referenced element type. Since you are using input, pass HTMLInputElement type in your useRef. Like this const inputFile = useRef<HTMLInputElement>(null);.

Ram Angelo Caceres
  • 71
  • 4