Как сделать предварительный просмотр PDF с помощью реагирующей дропзоны - PullRequest
Новая
       10

Как сделать предварительный просмотр PDF с помощью реагирующей дропзоны

0 голосов
/ 02 марта 2019

Мне трудно понять, как просматривать PDF-файлы, которые я загружаю, используя реагирующую дропзону.PNG и JPG работают отлично, но я также хотел бы иметь возможность показать пользователю либо сам PDF, либо изображение PDF.

Вот мой код:

handleImageDrop = (files) => {

const currentFile = files[0]
const reader = new FileReader()
reader.addEventListener("load", () => {
    this.setState({
      imgSrc: reader.result
    })
}, false)

reader.readAsDataURL(currentFile)

}

render () {

const { imgSrc } = this.state;

    <div>
      <Dropzone
        onDrop={this.handleImageDrop}
        multiple={false}>
          {({getRootProps, getInputProps}) => {
            return (
              <div
                {...getRootProps()}
              >
                <input {...getInputProps()} />
                {
                <p>Try dropping some files here, or click to select files to upload.</p>
                }
              </div>
            )
        }}
      </Dropzone>
      { imgSrc ? <img src={imgSrc}/> : null}
    </div>
</div>
)

}}

1 Ответ

0 голосов
/ 04 июня 2019

Это не может быть так просто, как показ изображения в теге <img>, но вы можете попробовать какую-нибудь внешнюю библиотеку для отображения PDF-файлов.Может быть, попробовать с Reaction-PDF

...