2.1.1 • Published 4 years ago
react-object-list-select v2.1.1
react-object-list-select
A list with selectable and keyboard navigable items. Useful as a dropdown (autocomplete), right click menu, or a simple list with actions triggered on item select.
Fork of react-list-select.
View the example.
Use:
import List from "react-object-list-select";
let items = ["Google", "TED", "GitHub", "Big Think", "Microsoft"];
let list = (
<List
items={items}
selected={[0]}
disabled={[4]}
multiple={true}
onChange={(selected: number) => {
console.log(selected);
}}
/>
);
ReactDOM.renderComponent(list, document.getElementById("container"));
Supports array of objects but the object should include keys 'id' and 'name' or 'value';
i.e
let items = [
{
id: "google",
name: "Google"
},
{
id: "ted",
name: "TED"
}
];
API
.select(index)
number
index - items array index
Select an item from the list
.deselect(index)
number
index - items array index
Deselect an item from the list
.disable(index)
number
index - items array index
Disable an item from the list to be selected or focused
.enable(index)
number
index - items array index
Enable a disabled item to be focused or selected
.focusNext()
focus next item from the list
.focusPrevious()
focus previous item from the list
.focusIndex(index)
number
index - items array index
Focus an item from the list
.clear()
Reset list state