如果在反应本机0.59中未定义Mobx @observable的init值,则它不起作用

时间:2019-05-24 09:45:57

标签: react-native observable mobx mobx-react

我正在将本机反应0.51.1迁移到0.59.8。而且我正面临Mobx的问题。

如果@observable装饰成员已分配了这样的初始化值

@observable cnt = 0;

然后它起作用。

但是,如果未定义,

@observable cnt;

然后它不起作用。

我有许多未定义的可观察商店,它们在0.51.0中工作。
我想让它像未定义的那样工作。

在迁移过程中,Babel装饰选项已更改。

// babel.config.js
module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
  plugins: [
    ['@babel/plugin-transform-flow-strip-types'],
    ['@babel/plugin-proposal-decorators', { 'legacy': true}],
    ['@babel/plugin-proposal-class-properties', { 'loose': true}],
  ],
}
//This doesn't work but worked in react-native 0.51.0
import { observable } from 'mobx';

export class Count {
  @observable cnt;

  constructor(initValue = 0) {
    this.cnt = initValue;
  }

  add(){
    this.cnt++;
  }
}
//This works
import { observable } from 'mobx';

export class Count {
  @observable cnt = 0;

  constructor(initValue = 0) {
    this.cnt = initValue;
  }

  add(){
    this.cnt++;
  }
}

2 个答案:

答案 0 :(得分:0)

我解决了显式声明undefined的问题。

@observable cnt = undefined;

答案 1 :(得分:0)

我在使用Babel和Typescript时遇到了这个问题。罪魁祸首是这些babel插件:

    ['@babel/plugin-transform-flow-strip-types'],
    ['@babel/plugin-proposal-decorators', { legacy: true }],

似乎未初始化的类属性上的装饰器不会被这些插件调用。它们可能会干扰Typescripts对类属性的处理。

我的babel.config.js现在看起来像这样:

module.exports = {
    plugins: [['@babel/plugin-proposal-decorators', { legacy: true }]],
    presets: ['module:metro-react-native-babel-preset']
};