Свойства плагина не добавляются к объекту FilePond в React

Я пытаюсь установить imagePreviewMaxHeight из filepond-plugin-image-preview plugin, но он не распознается. Похоже, что ни одно из свойств плагина предварительного просмотра не существует для объекта FilePond.

Это мой код:

import React, { useState } from 'react'
import { FilePond, registerPlugin } from 'react-filepond'
import FilePondPluginImageExifOrientation from 'filepond-plugin-image-exif-orientation'
import FilePondPluginImagePreview from 'filepond-plugin-image-preview'
import 'filepond/dist/filepond.min.css'
import 'filepond-plugin-image-preview/dist/filepond-plugin-image-preview.css'

registerPlugin(FilePondPluginImageExifOrientation, FilePondPluginImagePreview)

const ImageUploaderPage = () => {
 /* Needed to add typ any below since prop files seems to use type FilePondFile but onupdatefiles
on the other hand accepts ActualFileObject and some other types but not FilePondFile. */
  const [files, setFiles] = useState<any[]>([])

  return (
    <div>
      <h1>Image Uploader</h1>
      <FilePond
        acceptedFileTypes={['image/png', 'image/jpeg']}
        files={files}
        onupdatefiles={setFiles}
        allowMultiple={true}
        imagePreviewMaxHeight={100}
        server="/api"
        labelIdle="Choose files or drag them here."
      />
    </div>
  )
}

export default ImageUploaderPage

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

Плагин предварительного просмотра, очевидно, зарегистрирован, поскольку отображаются выбранные изображения ... но когда я обращаюсь к объекту FilePond с помощью oninit и ссылки, я могу подтвердить, что никаких свойств плагина не существует, а есть только те, которые используются по умолчанию.

РЕДАКТИРОВАТЬ: Я нашел свойство, которое я могу использовать, которое существует - styleItemPanelAspectRatio (Для него должно быть установлено строковое значение формата 1, а не 1: 1, как, например, stylePanelAspectRatio. Так что я счастлив на данный момент. .. но проблема выше все еще остается.


person Lisa Hammarström    schedule 04.11.2020    source источник


Ответы (1)


Кажется, это проблема библиотеки, из-за которой типы машинописного текста не устанавливаются должным образом.

Решение: временное исправление заключается в добавлении // @ts-ignore над свойствами, вызывающими ошибки. Т.е. свойства из FilePondPluginImagePreview, например imagePreviewHeight.

person Lisa Hammarström    schedule 20.11.2020