Question

我在mobx / react上有非常简单的配置。我试图为下面的笔记做简单的商店

//modal class
class Note {
    @observable body;
    @observable date;
    @observable by;
    @observable starred;

    constructor(body, by) {
        this.body = body;
        this.date = date.now();
      this.by=by;
      this.starred=false;
    }
}


//controller class
class NoteList {
    @observable notes = [];
    @computed get StarredNote() {
        return this.notes.filter(note => note.starred).length;
    }
}


const note_store =  new NoteList();
export default note_store
console.log('here');
console.log(note_store);


note_store.notes.push(
    new Note("Note 1",'SB'),
    new Note("Note 2",'PS')
);

但是我的note_store值未定义，这里有什么问题？

我的.babelrc

{
  "presets" : ["es2015", "react"],
  "plugins": ["transform-class-properties","transform-decorators-legacy"]
}

Answer 1

我钉了它，这是由于插件的顺序

来自文档

注意：插件顺序很重要！

如果手动包含插件并使用transform-class-properties，请确保transform-decorators-legacy出现在transform-class-properties之前。

/// WRONG

"plugins": [
  "transform-class-properties",
  "transform-decorators-legacy"
]

// RIGHT

"plugins": [
  "transform-decorators-legacy",
  "transform-class-properties"
]

更多https://github.com/loganfsmyth/babel-plugin-transform-decorators-legacy

使用mobx进行反应时，商店值未定义

1 个答案: