Skip to content

ViewModelsProvider Component ​

A context provider component that establishes a ViewModelStore instance for the React component tree, enabling centralized ViewModel management and cross-component access.

API Signature ​

tsx
function ViewModelsProvider(props: { children?: ReactNode; value: ViewModelStore }): ReactNode;

Keep value stable

Changing value does not move existing view models to the new store. To switch stores, remount the provider subtree (for example, change its key).

Usage ​

tsx
import { ViewModelStoreBase } from "mobx-view-model";
import { ViewModelsProvider } from "mobx-view-model-react";

const vmStore = new ViewModelStoreBase();

export const App = () => {
  return (
    <ViewModelsProvider value={vmStore}>
      ...
    </ViewModelsProvider>
  )
}