如何使用Google Dart web-ui @observable standalone？

Question

我无法弄清楚如何在对象的状态发生变化时使用@observable注解/ Observable类来获取简单通知。

import 'package:web_ui/observe.dart'; 

@observable class T{ 
    String x; 
// what else is needed? 
} 

T t = new T(); 
observe(t, (e) => print ("Value changed")); 
t.x = "Changed"; 

如果可能的话，我想使用没有其余web-ui的observables（作为backbone.js的替代品）。

Answer 1

您将需要运行dwc编译器，该编译器查找@observable并生成实际实现观察的新源代码。我从来没有试图在没有Web UI的情况下运行observables，但是您一定需要dwc来生成正确的输出。

Answer 2

我只是花了一些时间尝试做同样的事情。正如上面的答案中所述，不能在没有WebUI/Polymer的情况下使用@observable注释。但是，您可以使用可观察的包。这里有一个简单的例子：

import 'package:observe/observe.dart'; 

void main() { 
    var person = new Person(18, false); 

    person.changes.listen((List<ChangeRecord> changes) { 
    changes.forEach((PropertyChangeRecord change) { 
     print("$change"); 
    }); 
    }); 

    person.changes.listen((List<ChangeRecord> changes) { 
    changes.where((PropertyChangeRecord c) => c.name == #employed).forEach((PropertyChangeRecord change) { 
     print("Employment status changed!"); 
    }); 
    }); 

    print("start changing"); 

    person.age = 19; 
    person.age = 19; 
    person.age = 19; 
    person.age = 20; 
    person.employed = true; 
    person.age = 21; 
    person.age = 22; 

    print("finish changing"); 
} 

class Person extends ChangeNotifier { 

    int _age; 
    int get age => _age; 
    void set age (int val) { 
    _age = notifyPropertyChange(#age, _age, val); 
    } 

    bool _employed; 
    bool get employed => _employed; 
    void set employed (bool val) { 
    _employed = notifyPropertyChange(#employed, _employed, val); 
    } 

    Person(this._age, this._employed); 
} 

事件是异步的，所以要小心如果你依赖这些事件的顺序。上述程序的输出为

start changing 
finish changing 
#<PropertyChangeRecord Symbol("age") from: 18 to: 19> 
#<PropertyChangeRecord Symbol("age") from: 19 to: 20> 
#<PropertyChangeRecord Symbol("employed") from: false to: true> 
#<PropertyChangeRecord Symbol("age") from: 20 to: 21> 
#<PropertyChangeRecord Symbol("age") from: 21 to: 22> 
Employment status changed!