Provide and consume data sources in widgets
Apps created by Web AppBuilder are mapcentric apps, meaning all widgets have a map reference and can read data from a map. At version 2.5, a new concept called a data source is introduced, which is a new kind of data that widgets can use. There are two ways to generate a data source: configure an extra data source or generate it from a widget. Generated data sources are stored in the app config, and all of the widgets can use them. To learn how to configure a data source, see the Attribute topic.
A data source is a new way for widgets to communicate with each other. There are two sample widgets that demonstrate the data source concept: samplewidgets/DataSourceProvider and samplewidgets/DataSourceConsumer.
To provide a data source to a widget, override the getDataSources() function in the widget's Setting.js file. The function returns the data sources that your widget will provide, but you can return a promise that resolves the data sources as well. The data source is an object that has the follow properties:
| Property | Description |
|---|---|
| id | The data source ID. This ID does not contain “widgets~<widget id>~” . |
| type | Features/FeatureStatistics. |
| label | The label of the data source. |
| dataSchema | The dataSchema of the data source. See Datasource configuration for more information. |
When you add a widget that can provide a data source, the other widgets that can consume the data source use the data source provided by the widget. Note that this is only a data source definition, there is no actual data. To provide the actual data, the data-providing widget needs to call this.updateDataSourceData() to update the data at the widget run time. The updateDataSourceData function has two parameters: the data source ID and the data (the data is an object that has a features property).
To consume the data, the widget needs to determine how to consume the data in the widget settings page and override the onDataSourceDataUpdate function to listen to the data source change. To read the data that updated before the widget loaded, you can use DataSourceManager.getInstance().getData(dataSourceId) to get the data. There is a data source selection dijit that can help you configure the data source in the widget setting page: jimu.js/dijit/DataSource.