handleTreeViewCheckChange

Premium

A helper function which updates the check descriptor.

jsx

const App = () => {
   const [check, setCheck] = React.useState([]);
   const [items] = React.useState(tree);

   const onCheckChange = (event) => {
       setCheck(handleTreeViewCheckChange(event, check, items));
   }

   return (
       <div>
           <TreeView
               checkboxes={true} onCheckChange={onCheckChange}
               data={processTreeViewItems(items, { check })}
           />
           <div style={{ marginTop: 5 }}>
               <i>Press SPACE to check/uncheck the active item</i>
               <div className="example-config">
                   Checked Indices: {check.join(",")}
               </div>
           </div>
       </div>
   );
}

const tree = [ {
   text: 'Furniture', expanded: true, items: [
       { text: 'Tables & Chairs' }, { text: 'Sofas' }, { text: 'Occasional Furniture' } ]
}, {
   text: 'Decor', expanded: true, items: [
       { text: 'Bed Linen' }, { text: 'Curtains & Blinds' }, { text: 'Carpets' } ]
} ];

Parameters

event

TreeViewExpandChangeEvent

The event that triggered the change.

check

string[] | TreeViewCheckDescriptor

The check descriptor that will be updated.

data?

"null" | any[]

The TreeView items.

settings

TreeViewCheckChangeSettings

The additional settings that configure the update of the check descriptor.

childrenField?

string

The field that points to the dataItem sub items. Defaults to `items`. The default behavior allows the selection of multiple items.

Returns

any[] | TreeViewCheckDescriptor intersected with { ids: any[]; }

- The updated copy of the input check descriptor.