useList
The hook for loading a list of data items from the Qlik engine. To use it, pass an object with at least a dimension array.
The below example returns list data to the console from a
dimension
called country.import { useList } from "@motor-js/engine"
const Filter = () => {
const dimension = ['country'];
const {
listData,
select,
beginSelections,
endSelections,
selections,
clearSelections,
} = useList({
dimension,
});
console.log(listData);
return (
<div></div>
);
};
The following options can be passed into the hook
dimension: Array
- Required
- The dimension in your Qlik application from which you are extracting data for
- Needs to be an array containing a single item
qPage: Object
- Optional
- Must be an object in the following structure:
{ qTop: num, qLeft: num, qWidth: num, qHeight: num }
- Size of the extracted data from the engine
- Lists will always have a
qWidth
of 1
autoSortByState: Boolean
- Optional (default set to
true
) - Auto sorts items by state
The following properties are returned from the hook
listData: Array<Data>
- An array of data objects. See Data Properties for more information
select: Function([qElemNumber])
- A function to apply selections against the Qlik engine
- Needs to be an array of the element numbers you wish to select
- Element numbers are equivalent to the
key
field returned frommData
beginSelections: Function
endSelections: Function
selections: Array<Object>
- Array of objects containing the selected items. This data structure is the same as listData.
selectionsId: Array
- An array of selected element numbers
clearSelections: Function
- Clears all selections for the particular dimension
The following object properties are returned in each instance of the
listData
arraykey: number
- The Element number of the returned list item. This is a unique key associated to every returned data item
- Use this to apply selections
text: string
- The text value of the list item returned from the engine
number: number
- The number value of the list item returned from the engine
state: string
- Selection state
Last modified 2yr ago