All docs
V20.2
21.1 (EAP/Beta)
20.2
20.1
19.2
The page you are viewing does not exist in version 19.2. This link will take you to the root page.
19.1
The page you are viewing does not exist in version 19.1. This link will take you to the root page.
18.2
The page you are viewing does not exist in version 18.2. This link will take you to the root page.
18.1
The page you are viewing does not exist in version 18.1. This link will take you to the root page.
17.2
The page you are viewing does not exist in version 17.2. This link will take you to the root page.

Reporting for Vue

  • 2 minutes to read

Topics in this section describe how to create reporting applications based on the Vue.js framework.

Document Viewer

Integration

Customization

Report Designer

Integration

Localization

Client-Side API

To access the client-side Reporting API in Vue applications, use the following objects:

Client-side events in React are handled with callbacks specified in the Knockout bindings.

Event names and data in event arguments passed to the Angular callback handler functions are the same as events in an ASP.NET Core application. Review the following help topics with information on ASP.NET Core client-side events:

For more information on Knockout bindings, review the following help topics:

The following code snippet illustrates how to use the CustomizeExportOptions callback to remove the XLS format from the Export To drop-down list and from the Export Options panel:

import { ExportFormatID } from 'devexpress-reporting/dx-webdocumentviewer'
import ko from "knockout";


var componentData = {
    name: "WebDocumentViewer",
    mounted() {
    // ...
        var callbacks = {  
      CustomizeExportOptions: function(s, e){
        e.HideFormat(ExportFormatID.XLS);
      }
        };  
        ko.applyBindings({
      // ..
            callbacks: callbacks
        }, this.$refs.viewer);
    },
  // ...
};
export default componentData;