jspdf vxe-table 导出 pdf 文件,解决中文乱码问题

vxe-table 导出 pdf 文件,解决中文乱码问题

解决 jspdf 无法支持中文问题;
将表格导出为 pdf 文件,默认是不支持中文的,会显示成乱码,可以通过使用字体库解决。

npm install xe-utils vxe-table vxe-table-plugin-export-pdf jspdf`

// ...
import VXETablePluginExportPDF from 'vxe-table-plugin-export-pdf'
// ...

VXETable.use(VXETablePluginExportPDF)

// 可以将字体库下载放到自己服务器中,替换下载路径
VXETablePluginExportPDF.setup({
  // 设置全局默认字体
  fontName: 'SourceHanSans-Normal',
  // 字体映射配置
  fonts: [
    {
      fontName: 'SourceHanSans-Normal',
      fontUrl: 'https://cdn.jsdelivr.net/npm/vxe-table-plugin-export-pdf/fonts/source-han-sans-normal.js' 
    }
  ]
})

字体库可以去 github 下载

字体名称 文件名
SourceHanSans-ExtraLight source-han-sans-extralight.js
SourceHanSans-Light source-han-sans-light.js
SourceHanSans-Normal source-han-sans-normal.js
SourceHanSans-Regular source-han-sans-regular.js
SourceHanSans-Medium source-han-sans-medium.js
SourceHanSans-Bold source-han-sans-bold.js
SourceHanSans-Heavy source-han-sans-heavy.js

点击导出 pdf 文件
jspdf vxe-table 导出 pdf 文件,解决中文乱码问题_第1张图片
到此结束,完美支持中文字体
jspdf vxe-table 导出 pdf 文件,解决中文乱码问题_第2张图片

在线运行 http://jsrun.net/I8WKp/edit

你可能感兴趣的:(vue)