Javascript Vue-tables-2使用pdfmake库从多个选定表格行创建pdf文件

我想在vue-tables-2中创建多个选定行的pdf。我发现了一个名为的pdf库，它看起来很棒。作为一名新手，我正在努力了解如何：

将其放入vue-tables-2组件中。我要把这个导入 组件

如何创建多个选定表行数据的pdf？我有

this.checkedRows

查看tableData内容。我该如何将其输入pdf

我知道pdfmake如何具有构建datatable内容的说明，但如何使用vue-tables-2实现这一点

如果有人知道vue-tables-2的更好的pdf库，请告诉我。 这是我到目前为止的代码

<v-server-table url="/removals" :data="tableData" :columns="columns" :options="options">

    <input slot="selected" slot-scope="props" type="checkbox" :checked="props.row.selected" v-model="checkedRows" :value="props.row">

    <button slot="afterFilter" type="submit" @click="createPDF">Create PDF</button>

 </v-server-table>

我的方法

methods: {

    createPDF() {
        pdfMake.createPdf(docDefinition).download('PO.pdf');
    }


}

---

您可以使用以下命令安装

pdfmake

：

 npm install pdfmake --save-dev

并按如下方式导入和使用它

<template>....</template>
<script>
    var pdfMake = require('pdfmake/build/pdfmake.js');
    var pdfFonts = require('pdfmake/build/vfs_fonts.js');
    pdfMake.vfs = pdfFonts.pdfMake.vfs;

    export default{ 

        data() {
            return {
              tableData: [],
              checkedRows: [],
              columns: [
                   'selected',
                   'sku',
               ],

            options: {

                     }
           },
         methods: {

                            createPDF() {
        var docDefinition = {
        content: [
            {
                table: {
                    headerRows: 1,
                    widths: [ '*', 'auto', 100, '*' ],

                    body: []
                }
            }
        ]
        };
        docDefinition.content[0].table.body.push(this.columns);
        for(var i=0;i<this.checkedRows.length;i++){
            docDefinition.content[0].table.body.push(Object.values(this.checkedRows[i]));  
        }
        pdfMake.createPdf(docDefinition).download('PO.pdf');
    }



    }
     }

。。。。
var pdfMake=require（'pdfMake/build/pdfMake.js'）；
var pdfFonts=require（'pdfmake/build/vfs_fonts.js'）；
pdfMake.vfs=pdfFonts.pdfMake.vfs；
导出默认值{
数据（）{
返回{
tableData:[]，
checkedRows:[]，
栏目：[
'选定'，
“sku”，
],
选项：{
}
},
方法：{
createPDF（）{
变量定义={
内容：[
{
表:{
校长：1，
宽度：['*'，'auto'，100'，'*']，
正文：[]
}
}
]
};
docDefinition.content[0].table.body.push（this.columns）；
对于（var i=0；i
<template>....</template>
<script>
    var pdfMake = require('pdfmake/build/pdfmake.js');
    var pdfFonts = require('pdfmake/build/vfs_fonts.js');
    pdfMake.vfs = pdfFonts.pdfMake.vfs;

    export default{ 

        data() {
            return {
              tableData: [],
              checkedRows: [],
              columns: [
                   'selected',
                   'sku',
               ],

            options: {

                     }
           },
         methods: {

                            createPDF() {
        var docDefinition = {
        content: [
            {
                table: {
                    headerRows: 1,
                    widths: [ '*', 'auto', 100, '*' ],

                    body: []
                }
            }
        ]
        };
        docDefinition.content[0].table.body.push(this.columns);
        for(var i=0;i<this.checkedRows.length;i++){
            docDefinition.content[0].table.body.push(Object.values(this.checkedRows[i]));  
        }
        pdfMake.createPdf(docDefinition).download('PO.pdf');
    }



    }
     }