MobX decorators

If you use decorators in your view models, configure your TypeScript or Babel build to support the decorator syntax you chose. You can also avoid decorators entirely with makeObservable.

Base implementations of ViewModelStore and ViewModel are using makeObservable(this) in class constructor.

No-decorators approach

Disable decorator-based wrapping in the global viewModelsConfig before creating any view models:

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

viewModelsConfig.observable.viewModels.useDecorators = false;

Example of usage:

import { observable, action, makeObservable } from "mobx";
import { ViewModelBase, ViewModelParams } from "mobx-view-model";

class YourViewModel extends ViewModelBase  {
  constructor(params: ViewModelParams) {
    super(params);

    makeObservable(this, {
      fruitName: observable,
      setFruitName: action.bound,
    })
  }

  fruitName: string = '';

  setFruitName(fruitName: string) {
    this.fruitName = fruitName;
  }
}