React-pdf: onLoadSuccess Uint8Array рдбреЗрдЯрд╛ рдХреЗ рд╕рд╛рде рд╕рдХреНрд░рд┐рдп рдирд╣реАрдВ рд╣реБрдЖ

рдХреЛ рдирд┐рд░реНрдорд┐рдд 21 рдлрд╝рд░ре░ 2018  ┬╖  4рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ  ┬╖  рд╕реНрд░реЛрдд: wojtekmaj/react-pdf

рдореИрдВ рдПрдХ рд╡рд┐рд╢рд┐рд╖реНрдЯ рд╡рд╛рддрд╛рд╡рд░рдг (рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди) рдореЗрдВ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдкреАрдбреАрдПрдл рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ, рдЗрд╕рд▓рд┐рдП рдореИрдВ рдлрд╝рд╛рдЗрд▓ рдХреЛ http/https рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рд▓реЗрдХрд┐рди fs рд╕реЗ рд▓реЛрдб рдирд╣реАрдВ рдХрд░ рд╕рдХрддрд╛ред
рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ onLoadSuccess рдХреЛ рдирд┐рдХрд╛рд▓ рдирд╣реАрдВ рджрд┐рдпрд╛ рдЧрдпрд╛ рд╣реИ, рдХреНрдпрд╛ рдпрд╣ рд╕рд╛рдорд╛рдиреНрдп рд╣реИ?
рдореБрдЭреЗ рдкрд╣рд▓реЗ рдкреГрд╖реНрда рдХреЛ рдкреНрд░рд╕реНрддреБрдд рдХрд░рдиреЗ рд╕реЗ рдкрд╣рд▓реЗ рдкреГрд╖реНрдареЛрдВ рдХреА рд╕рдВрдЦреНрдпрд╛ рдкреНрд░рд╛рдкреНрдд рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИред

рд╕рднреА 4 рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

рдирд┐рд╢реНрдЪрд┐рдд рд░реВрдк рд╕реЗ рд╕рд╛рдорд╛рдиреНрдп рдирд╣реАрдВ! рдХреНрдпрд╛ рдлрд╝рд╛рдЗрд▓ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рдЕрдиреНрдпрдерд╛ рд▓реЛрдб рд╣реЛрддреА рд╣реИ? рдХреНрдпрд╛ рдЖрдк рдпрд╣рд╛рдВ рд░рд┐рдПрдХреНрдЯ-рдкреАрдбреАрдПрдл рдХреЗ рдЕрдкрдиреЗ рдХрд╛рд░реНрдпрд╛рдиреНрд╡рдпрди рдХреЛ рд╕рд╛рдЭрд╛ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ?

рд╣рд╛рдБ, рдлрд╝рд╛рдЗрд▓ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рднрд░реА рд╣реБрдИ рд╣реИред

рд╕реНрдерд┐рд░ рд░рд┐рд▓реАрдЬ рдФрд░ 3 рдЕрд▓реНрдлрд╛ рдкрд░ рдХреЛрд╢рд┐рд╢ рдХреАред

рдХреНрдпрд╛ рдореБрдЭреЗ рдХреБрдЫ рдпрд╛рдж рдЖрдпрд╛?

export default class PDFPlayer extends PureComponent {

  state = {
    fileLoaded: 0,
    numPages: null,
    pageNumber: 1,
  }

  componentWillMount() {
    const { filePath } = this.props;
    if (fs.existsSync(filePath)) {
      fs.readFile(filePath, (err, file) => {
        if (err) { console.log(err); }
        this.file = new Uint8Array(file);
        this.setState({ fileLoaded: 1 });
      });
    }
  }

  onLoadSuccess = (pdf) => {
    console.log('onDocumentLoad', pdf);
    this.setState({ numPages: pdf.numPages });
  }

  onRenderSuccess = (page) => {
    console.log(page.originalHeight);
  }

  render() {
    const { fileLoaded } = this.state;
    if (!fileLoaded) return null;
    return (
      <div style={{ ...styles.container, height: document.body.offsetHeight }}>
        <Document
          ref={(doc) => { this.document = doc; }}
          file={{ data: this.file }}
          onLoadSuccess={this.onLoadSuccess}
        >
          <Page onRenderSuccess={this.onRenderSuccess} pageNumber={1} />
        </Document>
      </div>
    );
  }
}

рдпрд╣ рдмрд┐рд▓реНрдХреБрд▓ рдареАрдХ рд▓рдЧ рд░рд╣рд╛ рд╣реИ! рдЖрд╢реНрдЪрд░реНрдп рд╣реИ рдХрд┐ рдХреНрдпрд╛ рдЖрдкрдХреЛ рдХрдо рд╕реЗ рдХрдо onSourceSuccess рдХреЙрд▓рдмреИрдХ рдорд┐рд▓рддрд╛ рд╣реИ ...!
рд╡реИрд╕реЗ, рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЖрдкрдХреЛ рдЗрддрдирд╛ рдХрд╛рдо рдХрд░рдиреЗ рдХреА рдЬрд░реВрд░рдд рдирд╣реАрдВ рд╣реИред

  1. рдореБрдЭреЗ рд╡рд┐рд╢реНрд╡рд╛рд╕ рд╣реИ рдХрд┐ рдЖрдкрдХреЛ рдЬреЛ рднреА рдлреЙрд░реНрдо fs.readFile рдорд┐рд▓реЗрдЧрд╛ рд╡рд╣ рднреА рд╕реНрд╡реАрдХрд╛рд░ рдХрд┐рдпрд╛ рдЬрд╛рдПрдЧрд╛ред
  2. file={this.file} рднреА рдареАрдХ рд╣реЛрдирд╛ рдЪрд╛рд╣рд┐рдПред

рдЗрд╕рдХреЗ рдЕрд▓рд╛рд╡рд╛ рдПрдХ рд╕рдВрдХреЗрдд, рдХрдВрдкреЛрдиреЗрдВрдЯрд╡рд┐рд▓рдорд╛рдЙрдВрдЯ рдЬрд▓реНрдж рд╣реА рдмрд╣рд┐рд╖реНрдХреГрдд рд╣реЛ рдЬрд╛рддрд╛ рд╣реИ, рдХрдВрдкреЛрдиреЗрдВрдЯрдбрд┐рдбрдорд╛рдЙрдВрдЯ рдкрд░ рдПрдХ рджрд╕реНрддрд╛рд╡реЗрдЬрд╝ рд▓реЛрдб рдХрд░рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд░реЗрдВ :)

рд╕рдВрдХреЗрдд рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж, рдореИрдВ componentDidMount рдмрджрд▓ рдЧрдпрд╛ рд╣реВрдВ


    1. рд╣рд╛рдБ рдпрд╣ Uint8Array рдмрд┐рдирд╛ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ


    1. рдирд╣реАрдВ, рдЬрдм рдореИрдВ рдСрдмреНрдЬреЗрдХреНрдЯ рдкрд╛рд╕ рдХрд┐рдП рдмрд┐рдирд╛ рд╕реАрдзреЗ рдлрд╝рд╛рдЗрд▓ рд▓реЛрдб рдХрд░рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд░рддрд╛ рд╣реВрдВ рддреЛ рдореБрдЭреЗ рдПрдХ рддреНрд░реБрдЯрд┐ рд╣реЛрддреА рд╣реИред

рдореБрдЭреЗ рдПрдХ рд╣реИрдХ рдорд┐рд▓рд╛ рд╣реИ, рдореБрдЭреЗ рдкрд╣рд▓реЗ рдкреГрд╖реНрда рдХреЛ рд▓реЛрдб рдХрд░рдиреЗ рдХреЗ рдмрд╛рдж рдкреГрд╖реНрдареЛрдВ рдХреА рд╕рдВрдЦреНрдпрд╛ рдЬрд╛рдирдиреЗ рдХреА рдЬрд░реВрд░рдд рд╣реИ, рдЗрд╕рд▓рд┐рдП рдореИрдВ рджрд╕реНрддрд╛рд╡реЗрдЬрд╝ рд╕реНрдерд┐рддрд┐ рдореЗрдВ рдкреГрд╖реНрдареЛрдВ рдХреА рд╕рдВрдЦреНрдпрд╛ рдкреНрд░рд╛рдкреНрдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдкрд╣рд▓реЗ рдкреГрд╖реНрда рдХреА рд░реЗрдВрдбрд░рд╕рдХреНрд╕реЗрд╕ рдХреА рдкреНрд░рддреАрдХреНрд╖рд╛ рдХрд░ рд░рд╣рд╛ рд╣реВрдВред рдореИрдВ рдЕрдкрдиреЗ рдкреНрд░реЛрдЬреЗрдХреНрдЯ рдореЗрдВ рдереЛрдбрд╝рд╛ рд╡реНрдпрд╕реНрдд рд╣реВрдВ рдЗрд╕рд▓рд┐рдП рдореБрдЭреЗ рдЗрд╕реЗ рдбреАрдмрдЧ рдХрд░рдиреЗ рдХрд╛ рд╕рдордп рдирд╣реАрдВ рдорд┐рд▓рд╛ред рдореБрдЭреЗ рдпрдХреАрди рдирд╣реАрдВ рд╣реИ рдХрд┐ рдпрд╣ рдЗрд╕рд▓рд┐рдП рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдореИрдВ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдкрд░ рдЪрд▓ рд░рд╣рд╛ рд╣реВрдВ рдпрд╛ рдХреНрдпреЛрдВрдХрд┐ рдореИрдВ рдПрдХ рд╕реНрдерд╛рдиреАрдп рдлрд╛рдЗрд▓ рд▓реЛрдб рдХрд░ рд░рд╣рд╛ рд╣реВрдВред рд╡реИрд╕реЗ рднреА, рдЬрдм рдореБрдЭреЗ рдЗрд╕реЗ рдбреАрдмрдЧ рдХрд░рдиреЗ рдХрд╛ рд╕рдордп рдорд┐рд▓реЗрдЧрд╛ рддреЛ рдореИрдВ рдЖрдкрдХреЛ рдЕрдкрдбреЗрдЯ рд░рдЦреВрдВрдЧрд╛ред

рдХреНрдпрд╛ рдпрд╣ рдкреГрд╖реНрда рдЙрдкрдпреЛрдЧреА рдерд╛?
0 / 5 - 0 рд░реЗрдЯрд┐рдВрдЧреНрд╕