DataTable导出PDF页码功能失效，添加代码后按钮消失报doc未定义错误

错误原因 #

• 配置结构错误：页码相关的doc.footer配置不属于buttons数组的直接子元素，你把这段代码直接写在按钮列表里，导致DataTable无法识别按钮配置，因此PDF导出按钮消失
• 变量作用域错误：doc是pdfHtml5导出时customize回调函数的入参，只有在customize的上下文里才能访问到，你在全局上下文直接调用doc自然会抛出未定义错误

修正后的完整代码 #

$('#table2').DataTable({
    dom: 'Bfrtip',
    buttons: [
        {
            extend: 'pdfHtml5',
            title: 'Data export',
            filename: 'dt_custom_pdf',
            pageSize: 'A4',
            exportOptions: {
                columns: ':visible',
                search: 'applied',
                order: 'applied'
            },
            // 新增customize配置，在回调内操作doc对象
            customize: function (doc) {
                doc.footer = (function(page, pages) {
                    return {
                        columns: [
                            'Left part of footer',
                            {
                                alignment: 'right',
                                text: [
                                    { text: page.toString(), italics: true },
                                    ' of ',
                                    { text: pages.toString(), italics: true }
                                ]
                            }
                        ],
                        margin: [10, 0]
                    }
                });
            }
        }
    ]
});

修正后PDF导出按钮会正常显示，导出的PDF每页底部都会显示对应的页码信息。

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