无法在React组件中渲染PDF

时间:2019-06-05 15:42:36

标签: reactjs react-pdf

Hellow 我目前一直停留在pdf文件的显示上,正在使用react-pdf的问题,它没有显示文档,而是直接下载而不显示其内容,请您帮我找到解决办法

import React, { Component } from "react";
//import { Document, Page } from "react-pdf";
import { Document, Page, pdfjs } from "react-pdf";
import PropTypes from "prop-types";
import { connect } from "react-redux";
pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${
  pdfjs.version
}/pdf.worker.js`;
class PDFShow extends Component {
  constructor(props) {
    super(props);
    this.state = {
      numPages: null,
      pageNumber: 1
    };
  }
  onDocumentLoadSuccess = ({ numPages }) => {
    this.setState({ numPages });
  };
  render() {
    const { current } = this.props.currentResource;
    const file = "/api/documents/" + current.name;
    return (
      <div>
        <Document file={file} onLoadSuccess={this.onDocumentLoadSuccess}>
          <Page pageNumber={this.state.pageNumber} />
        </Document>
        <p>
          Page {this.state.pageNumber} of {this.state.numPages}
        </p>
      </div>
    );
  }
}
PDFShow.propTypes = {
  currentResource: PropTypes.object.isRequired
};

const mapStateToProps = state => ({
  currentResource: state.currentResource
});
export default connect(
  mapStateToProps,
  {}
)(PDFShow);

0 个答案:

没有答案