@observable 与 extendObservable 用法

Question

@observable key = value; is sugar for extendObservable(this, { key: value })

和works on Fiddle，所以我做错了什么？

代码..

class Data1 {
  @observable all = [];
}

应该是一样的..

class Data2 {
  constructor() {
    extendObservable(this, {
      all : [],
    })
  }
}

?

但是..

测试..

Data1 中的测试失败...

test('all should be defined', () => {
  const data1 = new Data1();
  expect(store.all).toBeDefined(); // FAIL, IS NOT EVEN DEFINED
});

但是传入Data2 ...

test('all should be an observable array', () => {
  const data2 = new Data2();
  const isObservable = isObservableArray(data1.all);
  expect(isObservable).toBeTruthy(); // PASS!!
});

通天塔

在我的 .babelrc 我有...

{
  "presets": [
    [
      "env",
      {
        "targets": {
          "browsers": [
            "last 2 versions", "ios_saf >= 8", "not IE <= 10",
            "chrome >= 51", "firefox >= 49", "> 1%"
          ]
        }
      }
    ],
    "react"
  ],
  "plugins": [
    "transform-runtime",
    "transform-class-properties",
    "transform-object-rest-spread",
    "transform-decorators-legacy",
    "transform-es2015-parameters",
    "es6-promise",
    "lodash"
  ]
}

Answer 1

transform-class-properties必须在之后transform-decorators-legacy

我想念关于 decorator usage..

的文档

make sure that transform-decorators-legacy comes before transform-class-properties.

@observable 与 extendObservable 用法

@observable vs extendObservable usage

mobx

测试..

通天塔