使用 Unicode 十进制码时,jsPDF 和 Auto-Table 不会中断

jsPDF and Auto-Table not breaking when using Unicode decimal codes

提问人:Yolo_chicken 提问时间:10/17/2023 更新时间:10/17/2023 访问量:31

问:

我正在尝试使用 jsPDF 插件自动表来换表。该表是从 HTML 生成的,并且某些单元格在其中使用 Unicode 十进制代码。使用此标记时,它不会断行。有没有办法正确地打破这条线,或者这是一个我必须解决角色的错误?

代码片段如下,但也可能阻止 PDF、jsFiddle 链接

 const {
   jsPDF
 } = window.jspdf;

 function genPDF() {
   const doc = new jsPDF({
     orientation: "landscape",
     unit: "in",
     format: [8.5, 11]
   });

   doc.autoTable({
     html: '#my-table',
     tableWidth: 5,
     styles: {
       fontSize: 8,
       halign: 'left',
       overflow: 'linebreak'
     },
     columnStyles: {
       0: {
         cellWidth: 'auto'
       },
       1: {
         cellWidth: 'auto'
       },
       2: {
         cellWidth: 3
       }
     },
     rowPageBreak: 'auto'
   });

   doc.save('jsfiddle.pdf')

 }
<body>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js" integrity="sha512-qZvrmS2ekKPF2mSznTQsxqPgnpkI4DNTlrdUmTzrDgektczlKNRRhy5X5AAOnx5S09ydFYWWNSfcEqDTTHgtNA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/3.7.0/jspdf.plugin.autotable.min.js" integrity="sha512-X9Dd3Srt5HE0bHN7+BVmP2Wn2Eltyrsvn+szOxrLlI8mW+fv3jaFjd+HxwYzRsbJL1PI63mvztyDbYU56OtlOA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
  <button onclick="genPDF()">Generate PDF</button>

  <table class="text-white font-smaller" id="my-table">
    <thead>
      <tr>
        <th class="py-1" style="width:25%" scope="col">Term</th>
        <th class="py-1" scope="col">Phrasing</th>
      </tr>
    </thead>
    <tbody class="table-group-divider">
      <tr>
        <th class="text-center py-2" colspan="2">Section 1</th>
      </tr>
      <tr>
        <th scope="row">A</th>
        <td>Text here with words that don't have abbr tag <sup>1,2</sup></td>
      </tr>
      <tr>
        <th scope="row">B</th>
        <td>Text here with words that don't have abbr tag <sup>1,2</sup></td>
      </tr>
      <tr>
        <th scope="row">C</th>
        <td>this is a cell with long text and no special characters, so it is breaking correctly within the table. More words to force a break in the table cell. Lorem ipsum.;</td>
      </tr>
      <tr>
        <th scope="row">D</th>
        <td>this is a cell with long text and a special character: &#8804;, so it is not breaking correctly within the table. More words to force a break in the table cell. Lorem ipsum fshnjilkfweshnjkl </td>
      </tr>

    </tbody>
  </table>
</body>

javascript jspdf-autotable

评论


答: 暂无答案