3 ms·
You have reactive properties to model the internal state of a component but what's the recommended way to manage global state? Example: I click a button in a ro
by pmontra 3y ago
You have reactive properties to model the internal state of a component but what's the recommended way to manage global state? Example: I click a button in a row of a table and I make something happen outside the table, so several components upward the components tree of the page and then a few others downward in a different branch of the tree.
I'm sure there is a better way to do it but (10 seconds of thinking time) maybe a top component with just an empty div and a reactive property with the global state and the code to apply changes to the reactive properties of the appropriate children components, no matter how far down the tree? That seems something to standardize and not code from scratch every time.
- azangru 3y agoThere is a lit context package in lit-labs, which, like React context, can be used for passing the state across multiple layers of components; but I think that, just like with React context, it will not be sufficient if you have a lot of global state. In such a case, some state management library will probably be needed. I don't think Lit has any opinion on what such a library should be. I know some people like to leverage the web platform to its fullest, and just use a class that extends EventTarget for state management (see e.g. https://github.com/thepassle/app-tools/blob/master/state/index.js https://github.com/thepassle/app-tools/blob/master/state/ind...)
- gitaarik 3y agoI created LitState for this: https://github.com/gitaarik/lit-state https://github.com/gitaarik/lit-state