Observable 对象

Usage observable.object(props, decorators?, options?)

如果把一个普通的 JavaScript 对象传递给 observable 方法，对象的所有属性都将被拷贝至一个克隆对象并将克隆对象转变成可观察的。 (普通对象是指不是使用构造函数创建出来的对象，而是以 Object 作为其原型，或者根本没有原型。) 默认情况下，observable 是递归应用的，所以如果对象的某个值是一个对象或数组，那么该值也将通过 observable 传递。

import {observable, autorun, action} from "mobx";

var person = observable{
    // observable 属性:
    name: "John",
    age: 42,
    showAge: false,

    // 计算属性:
    get labelText() {
        return this.showAge ? `${this.name} (age: ${this.age})` : this.name;
    },

    // 动作:
    setAge(age) {
        this.age = age;
    }
}, {
    setAge: action
}

// 对象属性没有暴露 'observe' 方法,
// 但不用担心, 'mobx.autorun' 功能更加强大
autorun(() => console.log(person.labelText)

person.name = "Dave";
// 输出: 'Dave'

person.setAge(21
// 等等
Copy

当使对象转变成 observable 时，需要记住一些事情:

当通过 observable 传递对象时，只有在把对象转变 observable 时存在的属性才会是可观察的。稍后添加到对象的属性不会变为可观察的，除非使用 set 或 extendObservable。