A react component that makes data source easy to use. It helps widgets to create data source instance, load records and listen changes of data source.
In most cases, you can pass in useDataSource and query, and render the query result by using a render function as a child component.
The query result records are put into data source records property (Internally, it calls load() method).
DataSourceComponent: ConnectedComponent<typeofDataSourceComponentInner, { children?: ReactNode | DataRenderFunction; forceRefreshVersion?: number; onCreateDataSourceFailed?: (err: any) => void; onDataSourceCreated?: (ds: DataSource) => void; onDataSourceInfoChange?: (info: IMDataSourceInfo, preInfo?: IMDataSourceInfo) => void; onDataSourceSchemaChange?: (schema: IMDataSourceSchema, prevSchema?: IMDataSourceSchema) => void; onDataSourceStatusChange?: (status: DataSourceStatus, preStatus?: DataSourceStatus) => void; onQueryRequired?: (queryRequiredInfo: QueryRequiredInfo, preQueryRequiredInfo?: QueryRequiredInfo) => void; onSelectionChange?: (selection: ImmutableArray<string>, preSelection?: ImmutableArray<string>) => void; query?: QueryParams; queryCount?: boolean; useDataSource: ImmutableObjectMixin<UseDataSource> & { dataSourceId: string; fields?: ImmutableArray<string>; mainDataSourceId: string; rootDataSourceId?: string; useFieldsInPopupInfo?: boolean; useFieldsInSymbol?: boolean }; widgetId?: string }> = ...A react component that makes data source easy to use. It helps widgets to create data source instance, load records and listen changes of data source. In most cases, you can pass in
useDataSourceandquery, and render the query result by using a render function as a child component. The query result records are put into data sourcerecordsproperty (Internally, it callsload()method).const renderData = (ds: DataSource, info: IMDataSourceInfo) => { return <div> { ds && ds.getRecords().map(r => <div>{r.getId()}</div>) } </div> } <DataSourceComponent widgetId={props.id} query={{ where: '1=1' }} useDataSource={props.useDataSources[0]}>{renderData}</DataSourceComponent>