TreeView: Adding/removing/editing TreeViewItems dynamically

[pamtbaau]

I've two apps that use a TreeView. In both apps the TreeView needs to be dynamically updated by:

• Adding/removing TreeViewItems
• Replacing the value of a TreeViewItem (values are immutable objects)
• Updating the content of the TreeViewItem depending on the replaced value.

I've tried two approaches:

• Updating the underlaying tree of values (to-do's, or financial accounts/categories) and then rebuild the entire tree.
  Issues
  • Requires storing and maintaining which TreeViewItem is selected and/or expanded outside the TreeView.
  • Requires recreating entire tree after each insert/delete/update of underlaying values and apply selected/expanded properties.
• Adding/removing TreeviewItems to/from the children property of the parent.
  Issues
  • The content and value of a TreeViewItem are final and cannot be updated. This requires creating a new TreeViewItem and replacing the outdated one.

Both approaches feel awkward...

Questions:

• Is there something I've overlooked and can help in updating a tree dynamically?
• Any other approach I could try?

[bdlukaa]

The current only way to dynamically update a TreeView is by making it lazy and providing the items outside of it. When the items are loaded, just update the variable that holds that data and setState.

You can look at how we do it in the example app: https://bdlukaa.github.io/fluent_ui/#/navigation/tree_view

I would suggest a TreeViewController, but the current approach feels, which would allow finer control to the tree view and its items.

[pamtbaau]

The current only way to dynamically update a TreeView is by making it lazy and providing the items outside of it. When the items are loaded, just update the variable that holds that data and setState.

I think that roughly describes how I currently do it.