/Javascript/React/React useref file input

React useref file input

const App = () => {
  const inputRef = useRef(null);
  const [file, setFile] = useState(null);
  return (
    <>
      <input
        ref={inputRef}
        accept=".pdf"
        style={{ display: "none" }}
        id="raised-button-file"
        multiple
        type="file"
        onChange={e => {
          setFile(e.target.files[0]);
        }}
      />
      <label htmlFor="raised-button-file">
        <button component="span">
          <span>file</span>
        </button>
      </label>
    </>
  );
};

Source: stackoverflow.com

Similar codes

0 vote165 views1 answer
How to use two text fields in one single row react js
Javascript React
0 vote152 views1 answer
React-timeago npm
Javascript React
0 vote158 views2 answers
React native how to delete android build
Javascript React
0 vote156 views3 answers
Error: Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.
Javascript React
0 vote152 views1 answer
Warning React Hook useEffect has a missing dependency:
Javascript React
0 vote177 views1 answer
React native counter
Javascript React
0 vote155 views1 answer
Command reboot android app react native adb command
Javascript React
2 votes154 views1 answer
Emmet react self closing tags
Javascript React
0 vote160 views3 answers
How to hide a screen from drawer in react navigation 5
Javascript React
0 vote162 views1 answer
Onclick start and stop the count react
Javascript React