diff --git a/CHANGELOG.md b/CHANGELOG.md index 4c8cba79..fc7eb753 100755 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,6 @@ +# 6.7.2 (master) +- Fix: mobx strict mode for hooks and handlers + # 6.7.1 (master) - Fix: #632 observable hooks and handlers diff --git a/src/Base.ts b/src/Base.ts index edb74a03..1bba9606 100755 --- a/src/Base.ts +++ b/src/Base.ts @@ -918,7 +918,7 @@ export default class Base implements BaseInterface { */ each(iteratee: any, fields: any = null, depth: number = 0) { const $fields = fields || this.fields; - _.each(getObservableMapValues($fields), (field: FieldInterface, index) => { + getObservableMapValues($fields).forEach((field: FieldInterface, index) => { iteratee(field, index, depth); if (field.fields.size !== 0) { @@ -928,7 +928,7 @@ export default class Base implements BaseInterface { } reduce(iteratee: any, acc: any): any { - return _.reduce(getObservableMapValues(this.fields), iteratee, acc); + return getObservableMapValues(this.fields).reduce(iteratee, acc); } /****************************************************************** diff --git a/src/Field.ts b/src/Field.ts index 1e9bb29f..33142511 100755 --- a/src/Field.ts +++ b/src/Field.ts @@ -8,6 +8,7 @@ import { untracked, makeObservable, autorun, + runInAction, } from "mobx"; import _ from "lodash"; import Base from "./Base"; @@ -275,8 +276,8 @@ export default class Field extends Base implements FieldInterface { this.initMOBXEvent(FieldPropsEnum.interceptors); // setup hooks & handlers from initialization methods - Object.assign(this.$hooks, (this as any).hooks?.apply(this, [this])); - Object.assign(this.$handlers, (this as any).handlers?.apply(this, [this])); + runInAction(() => Object.assign(this.$hooks, (this as any).hooks?.apply(this, [this]))); + runInAction(() => Object.assign(this.$handlers, (this as any).handlers?.apply(this, [this]))); this.execHook(FieldPropsEnum.onInit); @@ -749,7 +750,7 @@ export default class Field extends Base implements FieldInterface { this.$resetting = false; this.$clearing = false; })) - if (deep) this.each((field: any) => field.resetValidation(deep)); + if (deep) this.each((field: FieldInterface) => field.resetValidation(deep)); } clear(deep: boolean = true, execHook: boolean = true): void { @@ -813,7 +814,7 @@ export default class Field extends Base implements FieldInterface { showErrors(show: boolean = true): void { this.showError = show; this.errorSync = _.head(this.validationErrorStack) as string; - this.each((field: any) => field.showErrors(show)); + this.each((field: FieldInterface) => field.showErrors(show)); } showAsyncErrors(): void { diff --git a/src/Form.ts b/src/Form.ts index 08ffd4b4..000d6327 100755 --- a/src/Form.ts +++ b/src/Form.ts @@ -1,4 +1,4 @@ -import { action, computed, observable, makeObservable, autorun } from "mobx"; +import { action, computed, observable, makeObservable, autorun, runInAction } from "mobx"; import _ from "lodash"; import Base from "./Base"; @@ -50,8 +50,8 @@ export default class Form extends Base implements FormInterface { }); this.name = name; - this.$hooks = hooks; - this.$handlers = handlers; + runInAction(() => (this.$hooks = hooks)); + runInAction(() => (this.$handlers = handlers)); // load data from initializers methods const initial = _.each( @@ -68,8 +68,8 @@ export default class Form extends Base implements FormInterface { ); // setup hooks & handlers from initialization methods - Object.assign(this.$hooks, (this as any).hooks?.apply(this, [this])); - Object.assign(this.$handlers, (this as any).handlers?.apply(this, [this])); + runInAction(() => Object.assign(this.$hooks, (this as any).hooks?.apply(this, [this]))); + runInAction(() => Object.assign(this.$handlers, (this as any).handlers?.apply(this, [this]))); this.state = new State({ form: this,