Vue FileManager - Ajax

The Ajax file provider works with a virtual file system represented by an array of JSON objects loaded from a URL.

import AjaxFileProvider from "devextreme-vue/ajax"
Type: DxAjaxTypes.default

Assign the URL to the url option. Data object fields should have conventional names listed in the url description. Otherwise, specify [fieldName]Expr options: nameExpr, sizeExpr, dateModifiedExpr, and so on.

The following code shows how to bind the FileManager to the Ajax file provider:

jQuery
index.js
$(function() {
    $("#fileManagerContainer").dxFileManager({
        fileProvider: new DevExpress.FileProviders.Ajax({
            url: "https://mydomain.com/data.json",
            thumbnailExpr: "icon",
            // ...
        })
        // A shortcut that can be used if object fields have conventional names
        fileProvider: "https://mydomain.com/data.json"
    });
});

Configuration

This section describes options that configure the Ajax file provider.

Name Description
dateModifiedExpr

Specifies which data field provides timestamps that indicate when a file was last modified.
isDirectoryExpr

Specifies which data field provides information about whether a file system item is a directory.
itemsExpr

Specifies which data field provides information about nested files and directories.
keyExpr

Specifies the data field that provides keys.
nameExpr

Specifies which data field provides file and directory names.
sizeExpr

Specifies which data field provides file sizes.
thumbnailExpr

Specifies which data field provides icons to be used as thumbnails.
url

Specifies the URL used to load an array of JSON objects that represent files and directories.

Methods

This section describes members used to manage file system items.

Name Description
getItemContent()

Gets the specified items' content.