Доступ к реквизитам в onSubmit метод response-dropzone-uploader - PullRequest
1 голос
/ 24 февраля 2020

Я использую react-dropzone-uploader для загрузки файлов. Все работает нормально; за исключением того, что я хочу, чтобы родительский компонент обновлялся после нажатия кнопки «Отправить». Что мне делать?

Это часть кода, которую я использую:


export default () => {

  const handleSubmit = (files, allFiles) => {
    console.log('uploads files:', files, this)
    // There is no access to props here.
  }

  return (
    <Dropzone
      getUploadParams={getUploadParams}
      onChangeStatus={handleChangeStatus}
      onSubmit={handleSubmit}
      accept="image/*,.pdf,.doc,.docx"
    />
  )
}

1 Ответ

0 голосов
/ 24 февраля 2020

Поскольку это функциональный компонент, вам не нужно this, и вы получаете реквизиты от

export default (props) => {

  const handleSubmit = (files, allFiles) => {
    console.log('uploads files:', files)
    // Get set state function from props
    props.setFiles(files)
  }

  return (
    <Dropzone
      getUploadParams={getUploadParams}
      onChangeStatus={handleChangeStatus}
      onSubmit={handleSubmit}
      accept="image/*,.pdf,.doc,.docx"
    />
  )
}

А в родительском компоненте вы можете назвать этот компонент как

...
const [files, setFiles] = useState(null)
...
return (
  <div>
  <div>Drop files</div>
  <CustomDropzone setFiles={setFiles} />
  </div>
)
...