JSFiddle - React, Tailwind, and code Playground

JavaScript

var dxDataGrids = [];
var BM_DataGrid = {
    showColumnLines: true,
    showRowLines: true,
    filterRow: {
        visible: true
    },
    searchPanel: {
        visible: true,
        width: 240,
        placeholder: 'Filter Search'
    },
    height: 'calc(100% - 54px)',
    columnAutoWidth: true,
    scrolling: {
        mode: 'standard',
        preloadEnabled: true
    },
    allowColumnResizing: true
};
var dataSource1 = [{
    RouteName: 'LE01',
    EmployeeRef: 'DRIVER1',
    VehicleRef: 'VEHICLE1',
    Difference: 0
}, {
    RouteName: 'LE02',
    EmployeeRef: 'DRIVER2',
    VehicleRef: 'VEHICLE2',
    Difference: 0
}, {
    RouteName: 'LE03',
    EmployeeRef: 'DRIVER3',
    VehicleRef: 'VEHICLE3',
    Difference: 0
}];
var dataSource2 = [{
    RouteName: 'LE04',
    EmployeeRef: 'DRIVER4',
    VehicleRef: 'VEHICLE4',
    Difference: 0
}, {
    RouteName: 'LE05',
    EmployeeRef: 'DRIVER5',
    VehicleRef: 'VEHICLE5',
    Difference: 0
}, {
    RouteName: 'LE06',
    EmployeeRef: 'DRIVER6',
    VehicleRef: 'VEHICLE6',
    Difference: 0
}];
dxDataGrids['Grid1'] = BM_DataGrid;
dxDataGrids['Grid2'] = BM_DataGrid;
dxDataGrids['Grid1'].dataSource = dataSource1; // Set DataSource 1
console.log(dxDataGrids['Grid1'].dataSource); // Write out field for 'Grid1' (CORRECT)
dxDataGrids['Grid2'].dataSource = dataSource2; // Set DataSource 2
console.log(dxDataGrids['Grid2'].dataSource); // Write out field for 'Grid2' (CORRECT)
console.log(dxDataGrids['Grid1'].dataSource); // Write out field for 'Grid1' (INCORRECT)