YUI3学习（八）---组件框架之 Plugin

?

?

插件可以让你无侵入地为衍生自Base类的宿主对象（称为host的对象）添加对象。如Node、Widget等类的对象实例。

可以通过继承Plugin.Base类来创建插件类。除此之外还可以通过后面的其他方法创建插件。

在Base类中已经介绍可以通过插件向组件实例添加功能，组件类甚至可以对插件功能一无所知。这样我们就可以在组件实例级别使用这些功能，

从而避免了为了添加这些功能而把组件类构造得很大或者构建多个不同的组件类。

?

1创建简单插件

对于简单的插件，如果不需要定义自己的事件和属性、不需要监听宿主的事件来改变宿主的行为、不需要重写宿主的方法的话，插件类可以只是简单的JavaScript类。

插件类唯一需要的是添加用作名称空间的静态属性“NS”，作为通过宿主实例对象来访问插件实例。

?

当插件被插入到宿主实例中后，插件实例就会被创建。宿主实例引用会作为参数传入到插件的构造器中，这样插件实例就可以获取宿主对象的引用。

当插件从宿主对象中拔出后，插件实例就被销毁。

?

??YUI框架中的插件，如?
?
?
方法
在某些情况下，插件需要覆盖宿主实例的一些方法。Plugin.Base提供的beforeHostMethod和afterHostMethod方法可以在宿主实例方法执行前后插入自定义的逻辑代码。
比如，为Widget实例的show和hide方法添加动画，可以通过覆盖控制widget boundingBox容器visibility样式的方法，添加修改透明度的动画来实现。
?
//一个为Widget的show/hide方法设置的动画插件function WidgetAnimPlugin(config) {      //...  }WidgetAnimPlugin.NAME = 'widgetAnimPlugin';  WidgetAnimPlugin.NS = 'fx';  WidgetAnimPlugin.ATTRS = {    animHidden : {        //...      },    animVisible: {          //...      }  };    // 扩展Plugin.Base 重载默认的改变显示状态的方法_uiSetVisible 。Y.extend(WidgetAnimPlugin, Y.Plugin.Base, {    initializer : function(config) {        // 在_uiSetVisible调用前调用_uiAnimSetVisible方法        this.beforeHostMethod("_uiSetVisible", this._uiAnimSetVisible);    },    _uiAnimSetVisible : function(show) {        if (this.get("host").get("rendered")) {              if (show) {                  this.get("animHidden").stop();                  this.get("animVisible").run();              } else {                  this.get("animVisible").stop();                  this.get("animHidden").run();            }            // 阻止默认方法执行。              return new Y.Do.Prevent(‘AnimPlugin prevented default show/hide’);        }      }  });
?
?
关于完整的 WidgetAnimPlugin例子，请访问YUI Plugin官方例子。
?
?
?
?
?
?
?
?
?
?
?
?
?