From 63acafc9ac1f0b9b9bdd5fedb7e2a22b65b8e999 Mon Sep 17 00:00:00 2001 From: Ethan Knapp Date: Tue, 25 Jul 2023 14:30:01 -0600 Subject: [PATCH] minor cleanups --- docs/enabling-decorators.md | 4 +- .../decorators_20223/stage3-decorators.ts | 6 +-- .../mobx/src/types/observableannotation.ts | 38 +++++++++---------- 3 files changed, 23 insertions(+), 25 deletions(-) diff --git a/docs/enabling-decorators.md b/docs/enabling-decorators.md index 8599934a2..f669346e0 100644 --- a/docs/enabling-decorators.md +++ b/docs/enabling-decorators.md @@ -62,10 +62,12 @@ MobX' 2022.3 Decorators are very similar to the pre-MobX 6 decorators, so usage - Addressing rest-destructuring, such is an anti-pattern in MobX - doing so would (likely unwantedly) touch all observables and make the observer overly-reactive). - `@action some_field = () => {}` was and is valid usage (_if_ `makeObservable()` is also used). However, `@action accessor some_field = () => {}` is never valid. -## Legacy Decorators +
Legacy Decorators We do not recommend new codebases that use MobX use legacy decorators until the point when they become an official part of the language, but you can still use them. It does require setup for transpilation so you have to use Babel or TypeScript. +
+ ## MobX Core decorators {🚀} MobX before version 6 encouraged the use of ES.next decorators to mark things as `observable`, `computed` and `action`. While MobX 6 recommends against using these decorators (and instead using [`makeObservable` / `makeAutoObservable`](observable-state.md)), it is still possible. diff --git a/packages/mobx/__tests__/decorators_20223/stage3-decorators.ts b/packages/mobx/__tests__/decorators_20223/stage3-decorators.ts index 0dc04ce3d..da5e92fef 100644 --- a/packages/mobx/__tests__/decorators_20223/stage3-decorators.ts +++ b/packages/mobx/__tests__/decorators_20223/stage3-decorators.ts @@ -682,13 +682,13 @@ test("reusing initializers", () => { test("enumerability", () => { class A { - @observable accessor a = 1 // enumerable, on proto + @observable accessor a = 1 @computed get b() { return this.a - } // non-enumerable, (and, ideally, on proto) + } @action - m() {} // non-enumerable, on proto + m() {} } const a = new A() diff --git a/packages/mobx/src/types/observableannotation.ts b/packages/mobx/src/types/observableannotation.ts index 1f345011d..c208b5dec 100644 --- a/packages/mobx/src/types/observableannotation.ts +++ b/packages/mobx/src/types/observableannotation.ts @@ -85,30 +85,26 @@ function decorate_20223_( initializedObjects.add(target) } - if (kind == "accessor") { - return { - get() { - if (!initializedObjects.has(this)) { - initializeObservable(this, desc.get.call(this)) - } - return this[$mobx].getObservablePropValue_(name) - }, - set(value) { - if (!initializedObjects.has(this)) { - initializeObservable(this, value) - } - return this[$mobx].setObservablePropValue_(name, value) - }, - init(value) { - if (!initializedObjects.has(this)) { - initializeObservable(this, value) - } - return value + return { + get() { + if (!initializedObjects.has(this)) { + initializeObservable(this, desc.get.call(this)) + } + return this[$mobx].getObservablePropValue_(name) + }, + set(value) { + if (!initializedObjects.has(this)) { + initializeObservable(this, value) } + return this[$mobx].setObservablePropValue_(name, value) + }, + init(value) { + if (!initializedObjects.has(this)) { + initializeObservable(this, value) + } + return value } } - - return } function assertObservableDescriptor(