CODEWITHSUNDEEP
vue.jsvuejs2pdfmake
Emmanuel Oliveira
Emmanuel Oliveira

Reputation: 164

Dynamic column in PDFMAKE

i'm using PdfMake to generate PDFs with on my VueJS app and i would like to know if i can control the impression of columns in my template, for example, using the data who was being printed like an variable.

I'm trying to reach something like this:

let var1: string = 'test';
let var2: string = 'test2';

1) Original code

var dd = {
    content: [
        {
            alignment: 'justify',
            columns: [
                {
                    text: 'var1'
                },
                {
                    text: 'var2'
                }
            ]
        },

    ],
    styles: {
        header: {
            fontSize: 18,
            bold: true
        },
        bigger: {
            fontSize: 15,
            italics: true
        }
    },
    defaultStyle: {
        columnGap: 50
    }

}

2) After/with validation

if var2 == null

var dd = {
        content: [
            {
                alignment: 'justify',
                columns: [
                    {
                        text: 'var1'
                    }
                ]
            },

        ],
        styles: {
            header: {
                fontSize: 18,
                bold: true
            },
            bigger: {
                fontSize: 15,
                italics: true
            }
        },
        defaultStyle: {
            columnGap: 50
        }

    }

Upvotes: 0

Views: 519

Answers (1)

igorvargas
igorvargas

Reputation: 36

Wouldn't setting a variable outside the document definition suffice?, I believe a piece of code will do the trick.

      var columns = [];
      var var1; // Defaults to undefined
      var var2; // Defaults to undefined
      
      var1 ="";
      
      // If we have a value we add the column
      if (var1 !== undefined) {
        columns.push({ text: "var1" });
      }
      
      if (var2 !== undefined) {
        columns.push({ text: "var2" });
      }
      
      // PDFMake document definition
      var dd = {
        content: [
            {
                alignment: 'justify',
                columns: columns
            },

        ]
        ...
    }

Upvotes: 1

Related Questions