在iframe中将src显示为datastring pdf不起作用(React - jspdf)

Question

当我点击一个按钮时，我正在尝试生成一个PDF来显示订单的收据。我正在使用jsPDF和React。当我调用外部pdf时，我实现了显示PDF，但当我将数据作为字符串传递时，它显示以下错误：

GET data:application/pdf;base64,
JVBERi0xLjMKMyAwIG9iago8PC9UeXBlIC9QYWdlCi9QYXJ…
l6ZSAyMAovUm9vdCAxOSAwIFIKL0luZm8gMTggMCBSCj4+
CnN0YXJ0eHJlZgoxOTYzCiUlRU9G net::ERR_INVALID_URL

就像iframe将SRC属性识别为URL而不是PDF文档一样。下面是我按下按钮时调用的函数：

handlePrintReceipt() {
  let pdfConverter = require('jspdf');
  let doc = new pdfConverter('p','pt','c6');

  doc.text('Simple text', 10, 10);
  let data = doc.output('datauristring');

  let iframe = `<iframe type="application/pdf" src="${data}#toolbar=0&navpanes=0" width="100%" height="450" frameborder="0"></iframe>`;

  this.setState({
    outputReceipt: iframe
  });
}

当我使用之前保存的简单PDF文档(如：'simple_text.pdf')更改iframe的SRC属性时，此实现运行良好。

我做错了什么？提前谢谢

Answer 1

我刚在dangerouslySetInnerHTML上添加了你的outputReceipt

<div dangerouslySetInnerHTML={{ __html: this.state.outputReceipt}}/>

和作品