Reactjs Pdf Tron错误“；异常错误：未找到Pdf错误"；（React应用程序）

我正在尝试将Pdf tron嵌入到我的React应用程序中。我在单击要筛选的选项卡以查找相关pdf文件时收到此错误

const handleFilteredDocs =  (id)=>{
  const filteredDoc =  props.location.documents && props.location.documents.filter(doc=>{
      return doc.controlId === id
    })
    setFileteredDoc(filteredDoc)
   setPdfPath(filteredDoc[0].filePath) 
   
    WebViewer(
    {
      path: 'lib',
      initialDoc: `lib/pdf/${pdfPath}`,
      extension: "pdf"
    },
    viewer.current,
  ).then((instance) => {
    const { docViewer, Annotations } = instance;
    
    const annotManager = docViewer.getAnnotationManager();
    
    
   

    docViewer.on('documentLoaded', () => {
      const rectangleAnnot = new Annotations.RectangleAnnotation();
      rectangleAnnot.PageNumber = 1;
      // values are in page coordinates with (0, 0) in the top left
      rectangleAnnot.X = 100;
      rectangleAnnot.Y = 150;
      rectangleAnnot.Width = 200;
      rectangleAnnot.Height = 50;
      rectangleAnnot.Author = annotManager.getCurrentUser();

      annotManager.addAnnotation(rectangleAnnot);
      // need to draw the annotation otherwise it won't show up until the page is refreshed
      annotManager.redrawAnnotation(rectangleAnnot);
    });
  });
 
   
 
  
    

  
  }

我认为是因为ref组件没有及时接收到pdfPath状态，然后抛出错误。我尝试放置一个单独的按钮来加载pdf，并正确更新pdfPath，在这种情况下可以正常工作。我该怎么做才能使它在那里正确渲染？ 这是我从控制台得到的错误：

(index)
Value
UI version  "7.3.0"
Core version    "7.3.0"
Build   "Mi8yMi8yMDIxfDZmZmNhOTdmMQ=="
WebViewer Server    false
Full API    false
Object
CoreControls.js:189 Could not use incremental download for url /lib/pdf/. Reason: The file is not linearized.
CoreControls.js:189 
{message: "The file is not linearized."}
CoreControls.js:189 There may be some degradation of performance. Your server has not been configured to serve .gz. and .br. files with the expected Content-Encoding. See http://www.pdftron.com/kb_content_encoding for instructions on how to resolve this.
CoreControls.js:189 There may be some degradation of performance. Your server has not been configured to serve .gz. and .br. files with the expected Content-Encoding. See http://www.pdftron.com/kb_content_encoding for instructions on how to resolve this.
CoreControls.js:189 There may be some degradation of performance. Your server has not been configured to serve .gz. and .br. files with the expected Content-Encoding. See http://www.pdftron.com/kb_content_encoding for instructions on how to resolve this.
81150ece-4c18-41b0-b551-b92f332bd17f:1 
81150ece-4c18-41b0-b551-b92f332bd17f:1 PDFNet is running in demo mode.
81150ece-4c18-41b0-b551-b92f332bd17f:1 Permission: read
CoreControls.js:922 Uncaught (in promise) 
{message: "Exception: ↵  Message: PDF header not found. The f… Function     : SkipHeader↵    Linenumber   : 1139↵", type: "InvalidPDF"}

谢谢你们的帮助，我会处理的

调用“setPdfPath”后，“pdfPath”的值尚未设置为“Filteredoc[0].filePath”（在下一次渲染之前，它仍然是初始状态）。您可以做的一件事是在“pdfPath”更新后使用“setState”调用“WebViewer（）”时传递回调函数

在下面的链接中还有一个关于如何将PDFtron添加到React项目的指南

需要注意的一点是，它的功能如下

useEffect(() => {
  // will only run once
  WebViewer()
}, [])

通过执行上述操作，“WebViewer”仅初始化一次。在文档之间切换时使用“loadDocument”（loadDocument），而不是在每次状态更改时重新初始化WebViewer，这可能是一个好主意