YUI3 Infrastructure下的 Attribute

此图转载于:http://houfeng0923.iteye.com/blog/1113593

提供扩展属性管理系统，它可以扩展任何类，包括get/set和内部的change事件，

增加类的属性：

 

YUI().use("attribute", function(Y) {

    function MyClass() {
        ...
    }

    Y.augment(MyClass, Y.Attribute);
});

 

 

设置类的属性：

 

var o = new MyClass({
    attrA:5
});

// Set attrB later on
o.set("attrB", "Hello World!");

 

 

配置类的属性：

 

 

 

function MyClass(userValues) {var attributeConfig = {
    attrA : {
        // Configuration for attribute "attrA"

        value: 5,

        setter: function(val) {
            return Math.min(val, 10); 
        },

        validator: function(val) {
            return Y.Lang.isNumber(val);
        }
    },

    attrB : {
        // Configuration for attribute "attrB"
    }
};

this.addAttrs(attributeConfig, userValues);

或者使用addAttr

 

this.addAttr("attrA", {
    // Configuration for attribute "attrA"

    value: 5,

    setter: function(val) {
        return Math.min(val, 10); 
    },

    validator: function(val) {
        return Y.Lang.isNumber(val);
    }
});

 

change事件：

 

o.on("enabledChange", function(event) {

    // event.prevVal will contain the current attribute value
    var val = event.prevVal;

    if (val !== someCondition) {
        // Prevent "enabled" from being changed
        event.preventDefault();
    }

});

 

 

Getting/Setting Sub Attribute Values

 

o.set("strings", {
    ui : {
        accept_label : "OK",
        decline_label : "Cancel",
    },
    errors : {
        e1000 : "Not Supported",
        e1001 : "Network Error"
    }
});

o.set("strings.ui.accept_label", "Yes");
o.set("strings.ui.decline_label", "No");

// Add a new property
o.set("strings.errors.e2000", "New Error");

// Cannot set new intermediate properties:
// "strings.messages" does not exist so can't set
// "strings.messages.intro"
o.set("strings.messages.intro", "Welcome");

var lbl = o.get("strings.ui.accept_label");