DevExtreme React - DataSource - store

Configures the store underlying the DataSource.

Type:

Store

|

Store Configuration

|

Array<any>

| any

This option accepts one of the following:

  • Store instance
    An ArrayStore, LocalStore, ODataStore, or CustomStore instance.

  • Store configuration object
    An ArrayStore, LocalStore, or ODataStore configuration object. Make sure to set the type option.

  • Array
    Assigning an array to the store option automatically creates an ArrayStore in the DataSource.

jQuery
JavaScript
var ds = new DevExpress.data.DataSource({
    store: new DevExpress.data.ArrayStore({
        // ArrayStore instance
    })
    // ===== or =====
    store: {
        type: "array",
        // ArrayStore configuration object
    }
    // ===== or =====
    store: [
        { id: 1, name: "John Doe" }
    ]
});
Angular
TypeScript
import DataSource from "devextreme/data/data_source";
import ArrayStore from "devextreme/data/array_store";
// ...
export class AppComponent {
    ds: DataSource;
    constructor() {
        this.ds = new DataSource({
            store: new ArrayStore({
                // ArrayStore instance
            })
            // ===== or =====
            store: {
                type: "array",
                // ArrayStore configuration object
            }
            // ===== or =====
            store: [
                { id: 1, name: "John Doe" }
            ]
        });
    }
}
Vue
App.vue
<script>
import DataSource from 'devextreme/data/data_source';
import ArrayStore from 'devextreme/data/array_store';

const ds = new DataSource({
    store: new ArrayStore({
        // ArrayStore instance
    })
    // ===== or =====
    store: {
        type: 'array',
        // ArrayStore configuration object
    }
    // ===== or =====
    store: [
        { id: 1, name: 'John Doe' }
    ]
});

export default {
    // ...
    data() {
        return {
            ds
        }
    }
}
</script>
React
App.js
// ...
import DataSource from 'devextreme/data/data_source';
import ArrayStore from 'devextreme/data/array_store';

const ds = new DataSource({
    store: new ArrayStore({
        // ArrayStore instance
    })
    // ===== or =====
    store: {
        type: 'array',
        // ArrayStore configuration object
    }
    // ===== or =====
    store: [
        { id: 1, name: 'John Doe' }
    ]
});

class App extends React.Component {
    // ...
}
export default App;

type

Specifies the storage type the DataSource uses.

Type:

String

Accepted Values: 'array' | 'local' | 'odata'

This option accepts one of the following values:

Each store has options that are detailed in the links above. Declare these options in the store object.

You can implement custom data access logic as described in the Custom Sources topic if these stores are not suitable.