I am trying to create a multiline footer with pdfmake; what I was able to do until now:

const docDefinition = {
    footer: [
        {
            stack: [
                { text: "Line 1" },
                { text: "Line 2" },
                { text: "Line 3" },
                { text: "Line 4" }
            ], style: 'footer'
        }
    ],
    styles: {
        footer: {
            fontSize: 6, bold: true, alignment: 'center'
        }
    }
};

While this creates what I want, the style is not correct. As soon as I increase the font size, the bottom line starts to disappear. If I set the font size to 12, only the first two lines appear in the generated PDF on the server-side.

What change do I need to make here?

CodePudding user response：

You just need to add margin to the page and you can accommodate as many lines as you want. e.g. Enter the code below in pdfmake playground: http://pdfmake.org/playground.html

// playground requires you to assign document definition to a variable called dd

let textFooter = `
    A 12.4% discretionary service charge will be added to your bill. All prices are inclusive of VAT. Thank You!\n\n
    This is line 2 - 263139\n
    Line 3 comes here\n
    Go big or go home!!!

    `;

var dd = {
    header: function(currentPage, pageCount, pageSize) {
    return [
      { text: 'simple text\naaa\nbbb\nccc\nddd', alignment: 'center', fontSize: 9 },
    ]
  },
    footer: function(currentPage, pageCount, pageSize) {
    return [
      { text: textFooter, alignment: 'center', fontSize: 9 },
    ]
  },
  // margin: [left, top, right, bottom]
    pageMargins: [ 40, 60, 40, 100 ],
    content: [
        'First paragraph',
        'Another paragraph, this time a little bit longer to make sure, this line will be divided into at least two lines'
    ]
    
}

In the code above, I have set margin bottom to 100 which gives us space to include 4 lines.