我有一个简单的文件上传形式。

import React, { useState } from 'react';
import { FlexContainer } from '@styles/FlexContainer';

const TestUpload = () => {
  const [file, setFile] = useState<File>();

  const onFileUpload = (event: React.ChangeEvent<HTMLInputElement>) => {
    if (!event.target.files) return;

    setFile(event.target.files[0]);
  };

  return (
    <FlexContainer>
      <input
        type="file"
        onChange={onFileUpload}
        accept="image/*"
        capture="camera"
        id="fileFromCamera"
      />
      <input
        type="file"
        onChange={onFileUpload}
        accept="image/*"
        id="fileWithoutCamera"
      />
    </FlexContainer>
  );
};

export default TestUpload;

字符串
问题是，当我在移动的设备上上传文件时，我的应用程序会刷新，整个应用程序会重新挂载。
然而，它只发生在部署上，并且在本地主机上工作良好。所以也许问题可能在WebPack配置中？
我试图修复它使用下面的代码在根组件，但它没有帮助.

useEffect(() => {
    const handleBeforeUnload = (event: BeforeUnloadEvent) => {
      event.preventDefault();
    };
    window.addEventListener('beforeunload', handleBeforeUnload);
    return () => {
      window.removeEventListener('beforeunload', handleBeforeUnload);
    };
  }, []);

型