`

求助:用这样的方式写Kissy组件,可行吗?(Kissy推荐的方式是怎样的?)

阅读更多
看了Kissy自带组件的代码,又看了你在D2上的PPT , 看得有些晕(现有组件和D2演讲说说的组件编写方式貌似不同啊).

不清楚Kissy推荐的组件编写风格应该是什么样子的.

希望Kissy能够写一个简单的组件, 作为参考实现(或模版). 并加以说明.
希望达到的效果是:
无论谁来编写Kissy的组件, 大家的代码结构 风格都做到统一, 就好像一个团队开发的一样.
避免当初JQuery组件遇到的问题.

当属Jquery虽然社区繁荣,组件众多. 但是大家各自为政,不同的组件编写的规范和编码风格相去甚远.
为使用和维护带来了很大的麻烦.

希望Kissy在最初就定义好详细的组件编写的规范/约定/风格.


顺便问一下 我的这个编写方式 有什么不妥, 该如何改进 谢谢了


KISSY.app('GOCOM');

GOCOM.add('TextField',function(app){
	var S=KISSY;
	
	function TextField(cfg){
		this.init(cfg);

		this.afterInit();
	}
	GOCOM.TextField=TextField;


        //之前已经定义好父类 GOCOM.Field,下面部分方法从Field中继承而来.

	S.extend(TextField,GOCOM.Field,{

		VERSION : '0.1',

		xtype : 'textfield',
		
		getDefaultConfig : function(){
			return {
				value : '',
				size : 10,
				type : 'text'
			}
		},
		getTemplate : function(cfg){

			var tmpl=[
				'<div id="'+cfg.id+'_box" >',
					'<input id="'+cfg.id+'" ',
						' name="'+cfg.name+'" ',
						' size="'+cfg.size+'" ',
						' type="'+cfg.type+'" ',
						' value="'+cfg.value+'" />',
				'</div>'
			
			];
			return tmpl.join('');
		},

		render : function(tar){

			tar=this.getRenderToEl(tar);
							
			if (!this.rendered && tar){
		
				var html=this.getTemplate(this.getConfig());
				this.boxEl=KISSY.one(KISSY.DOM.create(html));
				
				tar.append(this.boxEl);

				this.el=KISSY.one('input');

				this.initEvent(this.getConfig());
				this.rendered=true;
			}
		}
	
	});

        // 之前已经定义好 GOCOM.Class模块,用来管理类.
	GOCOM.Class.register(TextField.prototype.xtype , TextField);
});




求助 玉伯

分享到:
评论
1 楼 lifesinger 2010-12-29  
这样挺好的,fins 的代码已经很规范^o^

KISSY.app('GOCOM');  只要有一处写了即可。比如:

gocom.js      <--- KISSY.app('GOCOM', { version: xxx, ... })
textfiled.js  <--- GOCOM.add(...)

相关推荐

    更强的自动补全提示:提示补全组件:Kissy Suggest(转)

    使用Kissy Suggest首先需要引入Kissy库和Suggest组件的脚本文件。然后,创建一个HTML元素作为建议框的容器,并通过JavaScript设置配置项来初始化Suggest组件。配置项通常包括数据源、触发事件、提示样式等。 2. **...

    提示补全组件:Kissy Suggest

    标题中的“Kissy Suggest”是指Kissy框架中的一个组件,Kissy是一个轻量级的JavaScript库,专注于前端开发,提供了丰富的组件化功能。Suggest组件则是Kissy中用于实现自动提示、补全功能的部分,常见于搜索框或...

    Web常用UI库 kissy.zip

    Kissy 是一个由淘宝开发并开源的JavaScript库,它的设计目标是为Web开发者提供一套全面、强大且易用的UI组件。Kissy 的出现旨在简化Web应用的开发过程,提高开发效率,尤其在构建复杂的前端界面时表现出强大的优势。...

    异步上传组件uploader基于kissy

    Uploader组件是前端开发中用于处理文件上传功能的重要工具,它基于Kissy框架,提供了一种高效、灵活且兼容性良好的解决方案。Kissy是阿里巴巴开源的一个轻量级JavaScript库,它致力于简化前端开发,提供模块化、组件...

    KISSY.Suggest 仿百度、淘宝输入提示补全功能的组件及实例

    这个组件是基于KISSY框架构建的,旨在提供高效、易用且可定制的自动补全体验,适用于网页上的搜索框或者任何需要动态建议的输入场景。 **KISSY** 是一个开源的JavaScript组件库,它提供了丰富的UI组件和开发工具,...

    kissy源文件代码

    淘宝发布开源编辑器:...KISSY 目前基于 YUI 2.x 开发,目标是打造一系列小巧灵活、简洁实用、使用起来让人感觉愉悦的 UI 组件,目前已有 CSS 基础框架、搜索提示 Suggest 和 KISSY Editor 这个富文本编辑器等组件。

    淘宝KISSY动画组件SnakeSlider

    KISSY“轮播组件”,用于滚动展示图片,例如:焦点图。 引用了KISSY框架 SnakeSlider是一个可定制复杂动画的轮播组件,支持在切换显示/隐藏切片时分别显示不同动画,基于LayerAnim组件实现动画效果。

    kissy-1.4.8.rar

    3. **组件丰富**:Kissy 提供了一系列的内置组件,如 AJAX、DOM 操作、事件处理、动画效果等,这些组件经过精心设计和优化,可以快速构建出功能完备的前端应用。 4. **高性能**:Kissy 通过代码压缩、合并以及异步...

    kissy editor 2.0

    1. **Kissy框架**:Kissy Editor 2.0基于Kissy JavaScript库构建,Kissy是一个轻量级、模块化的前端开发框架,提供了一套完整的组件化开发方案,使得编辑器具有良好的性能和稳定性。 2. **DOM操作**:利用Kissy的...

    Kissy Suggest 自动提示例子

    《Kissy Suggest 自动提示实现详解》 在IT领域,自动提示功能是提升用户体验、提高工作效率的重要手段,尤其在编程、搜索等场景下。Kissy Suggest 是一个基于 JavaScript 的开源库,专为实现自动提示功能而设计。...

    Kissy 15天学会.zip

    4. **丰富的组件**:Kissy 提供了一系列实用的组件,如DOM操作、事件处理、Ajax请求、动画效果等,覆盖了前端开发的多个方面,可以帮助开发者快速构建复杂应用。 5. **工具链支持**:Kissy 配套有构建工具,如Gulp...

    top:返回顶部的kissy组件

    标题中的“top:返回顶部的kissy组件”指的是一个基于Kissy框架的JavaScript组件,它的主要功能是提供一个用户交互的方式,使用户可以方便地将页面滚动回到顶部。Kissy是一个轻量级、模块化的JavaScript库,它允许...

    kissy 学习

    2. **组件系统**:Kissy 提供了一系列的内置组件,如事件系统、DOM操作、AJAX通信、动画效果等,这些组件都是独立的,可以单独使用,也可以组合使用,极大地提高了开发效率。 3. **异步加载**:Kissy 支持延迟加载...

    kissy文件 kissyteam-kissyteam.github.com-901d2cd.rar

    7. **许可证文件**:通常为 LICENSE,说明了 Kissy 的开源协议,如 MIT 或 Apache 2.0,规定了代码的使用方式和限制。 通过这个压缩包,开发者不仅可以深入了解 Kissy 的实现原理,还可以学习到前端工程化的一些...

    shopify免费主题模板kissy

    Shopify是一款全球知名的电商平台建设工具,它为商家提供了一种简单易用的方式来创建和管理在线商店。"Kissy"是一个专门为Shopify设计的免费主题模板,由个人开发者辛勤工作数晚精心打造,专用于内衣商品的展示。在...

    Kissy学习教程

    Kissy 是一个轻量级的前端JavaScript库,它旨在简化Web开发,提高代码效率和可维护性。这个“Kissy学习教程”...通过这样的学习方式,你将能更全面、更深入地掌握Kissy的精髓,从而在实际工作中发挥出它的最大价值。

    kissy学习教程

    与jQuery相比,KISSY更加注重前端开发的整体解决方案,提供了更加丰富的UI组件,以及对触控事件和手势的原生支持,还有方便的滚动组件等。然而,KISSY的一个缺点是在其1.4.X版本中seed文件的体积较大,但是这一问题...

    修改的Kissy富文本编辑器

    "修改的Kissy富文本编辑器"是一款基于Kissy框架的增强型文本编辑器,它在原生的Kissy Editor基础上进行了定制和优化,旨在提供更丰富的功能和更好的用户体验。Kissy是一个轻量级的JavaScript库,专注于前端开发,而...

    JS开源编辑器 Kissy Editor

    **JS开源编辑器 Kissy Editor** 是一个专为前端开发者设计的轻量级文本编辑器,它具有良好的浏览器兼容性,能适应各种主流浏览器环境,包括Chrome、Firefox、Safari、Opera以及Internet Explorer等。Kissy Editor的...

    kissy Web编辑器,小巧灵活,简洁实用

    Kissy Web编辑器是一款专为Web开发者设计的轻量级文本编辑工具,以其小巧的体积、灵活的操作和简洁实用的特点而受到青睐。该编辑器旨在提供一个高效且易用的界面,让内容创作者在各种A级浏览器上都能享受到顺畅的...

Global site tag (gtag.js) - Google Analytics