Local Data

The WireBootstrap Local Data Connector is included in the core WireBootstrap framework. The WireBootstrap Local Data Connector allows arrays of objects to be used as a pseudo data service. These local arrays appear to the client framework as data services that can be queried dynamically. This data can also be loaded from remote static JSON or CSV files.

Provider Key

Use the local provider key to use the service provider for this data connector with a data source.

const source = new wire.data.DataSource("local", {
    ...
});

Configuration

Data

To use an object array as a source of data, set the array into the provider Data property.

const source = new wire.data.DataSource("local", {
    ...
    Provider: {
       Data: [
          { UserName: "jembid", FullName: "Joel Embid" },
          { UserName: "bsimmons", FullName: "Ben Simmons" }
       ]
    }
});

Json

To use a JSON file as a source of data, set the url property of the Json provider property to the URL of the JSON file.

The example below will load the sales.json file to be used as the source of data.

const source = new wire.data.DataSource("local", {
    ...
    Provider: {
       Json: { url: "./data/sales.json" }       
    }
});

Csv

To use a CSV file as a source of data, set the url property of the Csv provider property to the URL of the CSV file.

The example below will load the sales.csv file to be used as the source of data.

const source = new wire.data.DataSource("local", {
    ...
    Provider: {
       Csv: { url: "./data/sales.csv" }       
    }
});

Papa

CSV files are read and converted into an array of JavaScript objects using Papa Parse. This library will be loaded from the following CDN location if the Papa object has not already been loaded on the page.

To customize the configuration for Papa Parse for reading in CSV files, use the papa provider property. This property is a pass-through to the native Papa Parse configuration.

The example below changes the default field delimiter to a pipe.

const source = new wire.data.DataSource("local", {
    ...
    Provider: {
       papa: { delimiter: "|" }       
    }
});

Allow

Service providers are able to tell consumers about the functionality they support through an allow property. Below is a list of the functionality that the local service provider supports.

Last updated