Estoy tratando de usar PDFTron para cargar varios documentos y luego abrirlos dinámicamente en el evento onClick. El problema es que no puedo acceder al objeto de instancia desde fuera del retorno de la promesa de WebViewer: necesito crear botones dinámicos que carguen un documento según el botón en el que haga clic. No van a estar codificados, por lo que no puedo cargar documentos desde URL fijas para cada botón.
Aquí está el código de ejemplo de PDFTron. El mío es casi idéntico, la única diferencia es que necesito que loadDocumentButtons sea dinámico. No conozco una manera de hacer esto debido a problemas de alcance; el objeto de instancia está atrapado dentro del retorno de la promesa y no sé cómo acceder a él desde fuera del retorno de la promesa. ¿Alguien puede ayudarme con esto?
WebViewer({ ... }, viewerElement) .then(instance => { loadDocumentButton.on('click', () => { instance.loadDocument('mysite.com/myDocument.pdf', { documentId: 'id2' }); }); loadAnotherDocumentButton.on('click', () => { instance.loadDocument('mysite.com/myOtherDocument.pdf', { documentId: 'id2' }); }); });Hay un par de enfoques diferentes que podría tomar. La primera es usar un archivo de configuración, que es básicamente un archivo javascript que se ejecuta en el contexto del iframe en el que se ejecuta WebViewer. Ejemplo:
WebViewer({ initialDoc: "mydoc.pdf", config: "path/to/my/config/file.js" // relative to your HTML file }, viewerElement);Dentro del archivo de configuración tendrá acceso a los objetos Document, DocumentViewer y AnnotationManager (entre otros). Archivos de configuración
También puede llamar a la API getInstance , que devuelve una instancia existente de WebViewer.
import { getInstance } from '@pdftron/webviewer' // After WebViewer has already been constructed const instance = getInstance();