New to KendoReact? Start a free 30-day trial
processTreeViewItems
A helper function which applies the specified operation descriptors to the data.
jsx
class App extends React.Component {
state = { items: tree, expand: [], select: [], check: [] };
render() {
const { expand, select, check } = this.state;
return (
<TreeView
data={processTreeViewItems(this.state.items, { expand, select, check })}
expandIcons={true} onExpandChange={this.onExpandChange} checkboxes={true}
onCheckChange={event => this.setState({ check: [ event.itemHierarchicalIndex ] })}
onItemClick={event => this.setState({ select: [ event.itemHierarchicalIndex ] })}
/>
);
}
onExpandChange = (event) => {
let expand = this.state.expand.slice();
const index = expand.indexOf(event.itemHierarchicalIndex);
index === -1 ? expand.push(event.itemHierarchicalIndex) : expand.splice(index, 1);
this.setState({ expand });
}
}
const tree = [{
text: 'Item1',
items: [
{ text: 'Item1.1' },
{ text: 'Item1.2' },
{ text: 'Item1.3', items: [{ text: 'Item1.3.1' }] }]
}, {
text: 'Item2', disabled: true,
items: [{ text: 'Item2.1' }, { text: 'Item2.2' }, { text: 'Item2.3' }]
}, {
text: 'Item3'
}];
ReactDOM.render(<App />, document.querySelector('my-app'));
Parameters
data
undefined | "null" | any[]
The data that will be processed.
operations
The operation descriptors that will be applied to the data.
Returns
any[]
- The processed copy of the input data.