Kendo UI for Vue Native Excel Export Overview

The Kendo UI for Vue Native saveExcel method allows you to export and save data to Excel files, to customize the output cells and columns, and to filter the data after the export.

The saveExcel method is part of the Kendo UI for Vue library. It is distributed through NPM under the kendo-vue-excel-export package.

Basic Usage

The following example demonstrates the saveExcel method in action.

Functionality and Features

• Configuration of exported columns
• Customization of exported cells
• Customization of the workbook
• Filtering
• Saving files on the server
• Right-to-left support

Installation

1. Download and install the package:

   Copy Code   npm install --save @progress/kendo-vue-excel-export @progress/kendo-licensing

2. Once installed, import the method.

   Copy Code// ES2015 module syntax
   import { saveAs } from '@progress/kendo-file-saver';

   Copy Code// CommonJS format
   const { saveAs } = require('@progress/kendo-vue-excel-export');

3. Follow the instructions on the Kendo UI for Vue Activate License Key page to activate your license. You can skip this step if your application already contains a Kendo UI for Vue license file.

Compatibility

The Excel Export package is compatible with both Vue 2 and Vue 3.

Historically, all Kendo UI for Vue Native components support both Vue 2 and Vue 3, however Vue 2 is currently in its end-of-support phase till Nov 2024. After our last major release for 2024, Vue 2 will no longer be supported in the new versions of the Kendo UI for Vue components. Please check our Vue 2 End of Support article for more details.

Known Limitations

• Older browsers, such as Internet Explorer 9 and Safari, require you to implement a server proxy. For more information, refer to the section on the proxyUrl configuration.
• The maximum size of the exported file has a system-specific limit. For large data sets, we recommend using a server-side solution

Support and Learning Resources

• API Reference of the Excel Export Functionality
• Getting Started with Kendo UI for Vue - JavaScript (Online Guide)
• Getting Started with Kendo UI for Vue - TypeScript (Online Guide)
• Getting Started with Kendo UI for Vue - JavaScript + Options API (Online Guide)
• Getting Started with Kendo UI for Vue - TypeScript + Options API (Online Guide)
• Getting Started with Kendo UI for Vue - Nuxt 3 (Online Guide)
• Virtual Classroom (Training Course for Registered Users)
• Excel Export Forum
• Knowledge Base
• Kendo UI Productivity Tools extension for VS Code

Additional Resources

• Vue Blogs
• Kendo UI for Vue Roadmap