I'm getting into ReactJS and am intrigued but also confused about persistent data structures. I love the idea, but I'm not sure how to take my MV*, Mutable, Observable Bindings experience in designing view components and apply it in a sane way.
For example, suppose I have a deeply nested structure:
Foo
Bar
Baz
someValue
Qux
Quxx
In my UI, I have a component that is an editor for someValue
. In a mutate-observe paradigm I would do something like:
Baz.setSomeValue(newValue) // trigger observers, etc...
As near as I can tell, though, the equivalent with persistent data structures is something like:
Foo = extend(Foo, { Bar:{ Baz:{ someValue: newValue } } });
// recompute with new value of Foo
What is the normal pattern for encapsulating a component that deals with Baz
so that it doesn't have to know the entire structure?
setSomeValue
but instead of mutating it in place, efficiently create a new copy.