FilePond переопределяет server.process на React

Я пытаюсь использовать элемент управления FilePond в приложении React. Мне нужно обрабатывать загрузку файлов с помощью специального кода. Согласно документации, я должен использовать setOption для переопределения функции server.process. Ссылка на документацию

Это не вариант при использовании компонента React.

Я могу найти несколько случаев, когда люди пытались это сделать, но не могу найти примеров того, как это делается.

<FilePond 
  files={this.state.newFiles}
  allowMultiple={true}  
  server={this.someFunction}
/>

person Andrew Kennel    schedule 05.02.2020    source источник
comment
Вы проверяли эту ссылку? github.com/pqina/react-filepond   -  person bsekula    schedule 05.02.2020
comment
Да, следование этим инструкциям добавляет в компонент ref = {ref = ›(this.pond = ref)} и oninit = {() =› this.handleInit ()}. Но попытка вызвать this.pond.setOptions терпит неудачу с this.pond.setOptions не является функцией.   -  person Andrew Kennel    schedule 05.02.2020


Ответы (2)


В React вам нужно использовать server prop. Свойство server - это либо URL-адрес, либо объект конфигурации, а не функция.

<FilePond 
  files={this.state.newFiles}
  allowMultiple={true}  
  server={{
    process: (fieldName, file, metadata, load, error, progress, abort, transfer, options) => {
        // your processing code here
    }
  }}
/>

Для получения дополнительной информации просмотрите этот пример функции обработки: https://pqina.nl/filepond/docs/patterns/api/server/#advanced

person Rik    schedule 06.02.2020

Как указано в проблеме с github, FilePond.SetOptions не работает

В React объект FilePond является компонентом, доступного на данный момент глобального объекта FilePond. Вы можете передать свойства сервера компоненту как опору.

Я считаю, что вам нужно сделать то же самое, вместо вызова функции setOptions вы можете передать эти параметры в качестве свойств компоненту FilePond

Если вам действительно нужен доступ к setOptions, я добавил пример из response-filepond и добавил useEfect, где вы можете увидеть, как получить доступ к функции setOptions: принимает setOptions по ссылке

person bsekula    schedule 05.02.2020
comment
Звучит правильно ... но как? Я могу добавить свойство process = {() = ›this.uploadFiles ()}, но оно никогда не срабатывает. - person Andrew Kennel; 06.02.2020
comment
Обновленный ответ, добавив пример того, как получить функцию setOptions, если это не поможет, не могли бы вы обновить свой вопрос более подробной информацией о том, чего именно вы хотите достичь? - person bsekula; 06.02.2020