ViewModelStore interface

Interface representing a store for managing ViewModels

OPTIONAL USE

This is not required for targeted usage of this package, but can be helpful for accessing ViewModels from everywhere by ViewModelLookup

Reference to source code

Method and properties

getIds(vmLookup)

Retrieves ids of ViewModels based on vmLookup.

Example

vmStore.getIds(MyVM) // ["id"]
vmStore.getIds(ViewComponentOfMyVM) // ["id"]

getId(vmLookup)

Retrieves the id of the last ViewModel based on vmLookup.

Example

vmStore.getId(MyVM) // "id"
vmStore.getId(ViewComponentOfMyVM) // "id"

mountedViewsCount

The total number of views that are currently mounted.

has(vmLookup)

Checks whether a ViewModel instance exists in the store.
Requires vmLookup.

get(vmLookup)

Retrieves the last ViewModel instance from the store based on vmLookup.

TIP

If you need more than one VM, use getAll(vmLookup) method

Example

import { ViewModelBase } from "mobx-view-model";

class UserSelectVM extends ViewModelBase {
  selectedUser = {
    id: '1',
    name: 'John Doe'
  }
}

vmStore.get(UserSelectVM)?.selectedUser.id; // '1'

getAll(vmLookup)

Retrieves all ViewModel instances from the store based on vmLookup.

markToBeAttached(viewModel)

Called when a ViewModel is about to be attached to the view.
This is the first point where the created instance is passed to the store.

attach(viewModel)

Attaches a ViewModel to the store.

detach(viewModelId)

Detaches a ViewModel from the store using its ID.

isAbleToRenderView(viewModelId)

Determines if a ViewModel is able to render based on its ID.

createViewModel(config)

Creates a new ViewModel instance based on the provided configuration.

Example:

import {
  ViewModelStoreBase,
  ViewModel,
  ViewModelCreateConfig,
} from 'mobx-view-model';

export class ViewModelStoreImpl extends ViewModelStoreBase {
  createViewModel<VM extends ViewModel<any, ViewModel<any, any>>>(
    config: ViewModelCreateConfig<VM>,
  ): VM {
    const VM = config.VM;
    return new VM(config);
  }
}

processCreateConfig(config)

Processes the configuration for creating a ViewModel.
This method is called just before creating a new ViewModel instance.
It's useful for initializing the configuration, like linking anchors to the ViewModel class.
The config may contain anchors — additional React components that can be used as lookup keys for the same VM instance (e.g. useViewModel(AnchorComponent) will return this VM when mounted).

link()

Links anchors (React components) with ViewModel class.

unlink()

Unlinks anchors (React components) with ViewModel class.

generateViewModelId(config)

Generates a unique ID for a ViewModel based on the provided configuration.

clean()

Cleans up resources associated with the ViewModel store.
Cleans all inner data structures.