事件处理

容器对图元属性变化事进行统一处理，这样用户只需要通过监听图元容器，就可以响应所有图元的属性变化事件，不需要对每个图元单独添加监听

图元变化事件

图元属性变化时，图元容器会通过#dataChangeDispatcher 转发相应事件，改变图元的父子关系时，则可通过#parentChangeDispatcher进行监听

• #dataChangeDispatcher :Q.Dispatcher - 图元属性变化事件派发器
• #beforeDataPropertyChange(event) - 图元属性变化事件前
• #onDataPropertyChanged(event) - 图元属性变化事件发生后
• #parentChangeDispatcher :Q.Dispatcher - 图元父子关系变化事件派发器

示例1

添加图元属性变化监听器

var model = graph.graphModel;
var a = new Q.Node();
model.add(a);
model.dataChangeDispatcher.addListener({
    onEvent: function(evt){
        Q.log(evt.kind + ' changed. from [' + evt.oldValue + '] to [' + evt.value + ']');
    }
});
a.name = 'A';
a.name = 'B';

打印结果：

name changed. from [undefined] to [A]
name changed. from [A] to [B]

示例2

监听父节点变化，注意这里用到了监听器的另一种写法，直接传入监听函数

var model = graph.graphModel;
 
var a = new Q.Node('A');
model.add(a);
var b = new Q.Node('B');
model.add(b);
 
model.parentChangeDispatcher.addListener(function(evt){
    Q.log(evt.source.name + '\'s ' + evt.kind + ' changed. from [' + evt.oldValue + '] to [' + evt.value.name + ']');
});
 
a.parent = b;

打印结果：

A's parent changed. from [undefined] to [B]

图元容器变化事件

图元集合发生变化时（如添加，删除……），系统会派发集合变化事件，可通过#listChangeDispatcher进行监听

#listChangeDispatcher :Q.Dispatcher - 集合变化事件派发器

示例

监听图元容器集合变化事件

var model = graph.graphModel;
 
model.listChangeDispatcher.addListener(function(evt){
    Q.log(evt.kind);
});
 
var a = new Q.Node('A');
model.add(a);
var b = new Q.Node('B');
model.add(b);
model.remove(a);
model.clear();

打印结果：

add
add
remove
clear