MenuButton.Option Class
模拟select > option,与 MenuButton.Select 配合使用。xclass : option
Constructor
MenuButton.Option
-
config
Parameters:
-
config
Object
Example:
require(['menu', 'menubutton'], function(Menu, MenuButton){
//全新生成
var select2 = new MenuButton.Select({
render : '#container',
prefixCls : 'c2c',
width : 100,
menu : {
xclass : 'popupmenu',
align : {
offset : [0, -1]
},
children : [
new MenuButton.Option({ //构造器生成
value : 'customValue',
content : '北京',
prefixCls:"c2c-"
}),
{
xclass : 'option', //xclass生成
content : '杭州',
prefixCls:"c2c-"
},
{
xclass : 'option',
content : '广州',
prefixCls:"c2c-"
}
]
}
});
select2.render();
});
Item Index
Methods
Attributes
Methods
addAttr
-
name
-
attrConfig
给宿主对象增加一个属性
Parameters:
-
name
String属性名
-
attrConfig
Object属性配置信息, 支持下面的配置项:
-
value
String | Number属性默认值。注意默认值请不要设置为复杂对象(通过自定义构造器 new 出来的),复杂对象可设置 valueFn 返回.如果配置项中没有设置 value, 会调用 valueFn 函数获取默认值并赋给 value
-
valueFn
Function提供属性默认值的函数,传入对象内部对应的属性值和属性名,取该函数的返回值作为最终值给用户
-
setter
Function写属性时的处理函数,传入从 set() 参数得到的属性值和属性名,如果返回非 undefined 则作为新的属性设置值
-
getter
Function读属性时的处理函数
-
validator
Function写属性时的验证函数,传入从 set() 参数得到的属性值和属性名,返回 false 则不改变该属性值
-
addAttrs
-
attrConfigs
-
values
批量添加属性
addTarget
-
target
添加冒泡事件源对象
Parameters:
-
target
Object事件往上冒泡的事件源
Example:
require(['util', 'event/custom'], function(Util, CustomEvent) {
function Custom(id){
this.id = id;
this.publish("run",{
bubbles:1
});
}
Util.augment(Custom, CustomEvent.Target);
var c1 = new Custom("c1");
var c2 = new Custom("c1");
c1.addTarget(c2);
c2.on("run",function(e){
S.log(e.target.id +" fires event run"); // => c1 fires event run
});
c1.fire("run");
});
blur
()
使组件失去焦点
callSuper
()
调用父类的对应方法,如果没有,则返回undefined
Example:
require(['base'], function(Base) {
var A = Base.extend({
m: function (value) {
return 'am:' + value;
},
m2: function (value) {
return 'am2:' + value;
}
});
var B = A.extend({
m: function(value) {
return 'bm:(' + this.callSuper(value) + ')';
},
m2: function(value) {
return 'bm2(' + this.callSuper.apply(this, arguments) + ')';
}
});
var b = new B();
console.log(b.m(1));
console.log(b.m2(2));
});
create
()
创建当前组件的DOM结构,control将会代理给render
Returns:
自身
destroy
()
销毁实例
detach
-
eventType
-
fn
-
[scope]
解除绑定的事件处理器
extend
-
[extensions]
-
methodDesc
-
staticAttributes
-
desc
从当前类上扩展出一个子类
Parameters:
-
[extensions]
Function[] optional扩展类数组
-
methodDesc
Object方法集合键值对
-
staticAttributes
Object放到新产生组件类上的静态属性集合键值对,其中 ATTRS 属性特殊对待
-
desc
Object类元信息
-
name
String类名
-
fire
-
type
-
eventData
触发绑定 type 类型的事件处理器, 并给触发的事件处理器的事件对象参数中混入数据 eventData
Returns:
如果其中一个事件处理器返回 false , 则返回 false, 否则返回最后一个事件处理器的返回值
focus
()
使组件获得焦点
get
-
name
获取属性 name 的值
Parameters:
-
name
String属性名.也可以为 “x.y” 形式. 此时要求 x 属性为包含 y 属性的普通 Object.当没有设置属性值时, 会取该属性的默认值
getPlugin
-
id
根据指定的 id 获取对应的plugin实例
Parameters:
-
id
Stringplugin实例的id
Returns:
对应的plugin实例
Example:
dialog.getPlugin('component/plugin/drag')
.getPlugin('dd/plugin/constrain')
.set('constrain', false);
hide
()
隐藏组件
Returns:
自身
on
-
eventType
-
fn
-
[scope]
为相应事件添加事件处理器
Parameters:
-
eventType
String | Object- 当为String时 包含一个或多个事件名称的字符串, 多个事件名以空格分开。 事件可以通过加点来表示分组,例如 "click.one" , "click.two"
- 当为Object时,类似这样:
{ 'click':{ fn:function(){ }, filter: '' // delegate, once:true // 绑定一次 }, 'mouseenter':function(){} }
-
fn
Function当事件触发时的回调函数
-
[scope]
Object optional回调函数的 this 值. 如果不指定默认为绑定事件的当前元素
plug
-
plugin
安装指定插件
Returns:
自身
Example:
require(['overlay', 'component/plugin/resize'],function(Overlay,Resize){
new Overlay({
content:'test'
}).plug(new Resize({
handlers:['t','t']
}));
});
publish
-
type
-
cfg
配置自定义事件的一些特有信息
render
()
把当前组件的DOM结构放入 DOM 文档中,并绑定事件,同步属性
Returns:
自身
reset
-
name
-
opts
重置属性 name 为初始值. (调用一次 set() )
set
-
name
-
value
-
opts
设置属性 name 的值为 value
Parameters:
Returns:
该次属性设置是否生效(是否通过了 validator 验证)
show
()
显示组件
Returns:
自身
sync
()
同步属性值.组件基类增加 sync 函数,调用后可调用父类、扩展类、插件对应的 syncUI 方法
unplug
-
plugin
卸载指定插件
Returns:
自身
Example:
require(['overlay','component/plugin/resize'],function(Overlay,Resize){
var o= new Overlay({
content:'test'
}).plug(new Resize({
handlers:['t','t']
}));
o.unplug('component/plugin/resize'); // 卸载 resize 插件
});
Attributes
listeners
Object
配置组件的事件绑定,例如:
{
listeners:{
customEvent:function(e){
alert(e.type); // => "customEvent"
}
}
}
or
{
listeners:{
customEvent:{
fn:function(e){
// e.type // => customEvent
// this.xx => 1
},
context:{xx:1}
}
}
}
plugins
Function[] | Object[]
插件构造器数组或插件对象数组. 例如
{
plugins: [ Plugin1,Plugin2 ]
}
// or
{
plugins: [new Plugin1(cfg),new Plugin2(cfg)]
}
prefixCls
String
可选,默认 “ks-” . 组件的 css 样式类前缀 . 例如假设组件为 menu ,则该组件内的样式类名为 {prefixCls}menu,默认为 “ks-menu”.可用于实现自定义皮肤
srcNode
KISSY.Node
可选,组件从页面中已存在的该节点中渲染而来.srcNode 时设置其他属性不起作用,属性通通在 html 标签中指定,并且 html 标签必须包含完整结构,例如 content 节点必须存在
Events
*Change
每调用 set() 一次后就触发一次该事件
afterAttrNameChange
名为 “attrName” 的属性, 在改变它的值之后触发该事件
beforeAttrNameChange
名为 “attrName” 的属性, 在改变它的值之前触发该事件