New to Kendo UI for Vue? Start a free 30-day trial

PDF Export

The data of the Native TreeList component can be easily exported to a PDF file. Depending on the requirements of the targeted scenario, you can modify the exported data the way you need it. The current article covers three popular data export scenarios:

Getting Started

To enable the PDF export:

  1. Install kendo-vue-pdf package.

    npm install @progress/kendo-vue-pdf @progress/kendo-licensing
  2. Import the TreeListPDFExport component in your Vue Application.

    import { TreeListPDFExport } from '@progress/kendo-vue-pdf';
  3. Wrap the TreeList inside a TreeListPDFExport component.

  4. Define a ref of the TreeListPDFExport.

  5. Call the save function of the TreeListPDFExport component.

The following example demonstrates the basic implementation of the PDF export functionality of the TreeList.

Example
View Source
Change Theme:

Exporting All the Data loaded in the TreeList

To export specific TreeList data, pass the data to the save function of the TreeListPDFExport component. For example, if the TreeList has its paging enabled but you need to export all pages and all records expanded, pass the processed data to the save function.

Example
View Source
Change Theme:

Customizing Exported Columns

The TreeListPDFExport provides the ability to add or hide some of the columns in the exported PDF file. This is done by passing the columns that have to be exported to the save function.

Example
View Source
Change Theme:

Known Limitations

For full list of the PDF export known limitations refer to the drawing package.