【问题标题】:A field goes off the page when using jspdf-html2canvas使用 jspdf-html2canvas 时字段离开页面
【发布时间】:2021-01-19 23:00:16
【问题描述】:

我正在使用“jspdf-html2canvas”和一个包含大量文本的文本字段,位于页面的右侧。我已经尝试了太多东西来列出试图让它在多行上换行但没有任何效果。这是当前代码:

<div id="page" >
           <div className="page page-1">
             <br /> 
             <table>
               <tbody>
                 <tr>
                   <th>EIA Ref</th>
                 </tr>
                 <tr>
                   <td>{this.state.PolicyOwnerTitle}</td>
                 </tr>
               </tbody>
             </table>
           </div>
           <div className="page page-2" >
             <br /> 
             <table >
                 <tr  >
                   <td>{this.state.Beneficiaries}</td> //this is the one!
                 </tr>
             </table>
           </div>

public documentPrint2 = (e) => {
    const pages = document.getElementsByClassName('page');

    html2PDF(pages, {
      jsPDF: {
        unit: 'px',
        format: 'a4',
        orientation: 'p',
        
      },
      html2canvas: {
        imageTimeout: 15000,
        logging: true,
        useCORS: false,
        windowWidth: '1000px',
        
      },
      margin: {
        margin: {
          top: 0,
          right: 0,
          bottom: 0,
          left: 0,
      },
    },
      imageType: 'image/jpeg',
      imageQuality: 1,
      output: this.state.PPName+'.pdf',
      
    });
  }

这就是正在发生的事情:

有人知道我可以如何包装字段吗?

更新:我可以将文本放入 html 中的 a 中,这样文本会在包装在一个框中时出现,但是当生成 pfg 时,它仍然会在一行中显示文本。

进一步更新:如果我只在 html 中输入文本(例如,一段长文本),它可以正常工作。问题是如果我使用{this.state.Beneficiaries}

我还有什么选择??!!!

【问题讨论】:

    标签: reactjs sharepoint-online html2canvas html2pdf


    【解决方案1】:

    解决了。只需将 SharePoint 中的列更改为纯文本。不知道为什么它会使用富文本或增强文本。

    【讨论】:

      猜你喜欢
      • 2016-04-05
      • 2019-12-28
      • 1970-01-01
      • 1970-01-01
      • 2020-07-12
      • 2018-01-12
      • 2020-01-11
      • 1970-01-01
      • 2022-01-26
      相关资源
      最近更新 更多