使用Roboto字体时jsPDF无法打印制表符(\t)后内容的问题

问题根源 #

• jsPDF对内置字体（如Helvetica）和自定义字体（如Roboto）的字符处理逻辑完全不同：
  • 内置字体是PDF标准自带的，jsPDF针对这类字体做了特殊处理，会自动把制表符(\t)转成空格，文本能完整显示。
  • 自定义字体是从外部文件导入的，jsPDF渲染时会严格按照字体文件的字符映射来处理，而制表符通常不属于字体的可打印字符范畴，导致jsPDF一碰到\t就直接停止渲染后面的内容。

解决办法 #

1. 手动替换制表符为空格 #

在把文本传给doc.text()之前，全局替换所有制表符为空格即可：

var customText = '<p>This\tis\ta\ttest\tusing\ttab</p><p>This is a test using spaces</p>';
// 把所有\t替换成单个空格
customText = customText.replace(/\t/g, ' ');
doc.setFont('roboto','normal');
doc.text(customText, 1, 10);

2. 自定义缩进效果（可选） #

如果需要模拟制表符的缩进宽度（比如4个空格），可以换成对应数量的空格：

customText = customText.replace(/\t/g, '    '); // 替换为4个空格

3. 检查字体导入完整性（辅助操作） #

确认你导入的Roboto字体文件包含完整的ASCII字符集，但就算字符集没问题，jsPDF的自定义字体渲染逻辑还是不会自动处理制表符，所以替换是最靠谱的方案。

内容的提问来源于stack exchange，提问作者Brank Victoria