翻译 - 【Dojo Tutorials】Creating Template-based Widgets

原文:Creating Template-based Widgets

在本教程中,你将学习Dijit的_TemplatedMixin混入类的重要性与如何利用模版快速创建你自己的自定义挂件。

开始

如果你不熟悉如何创建Dijit挂件,你也许需要想看看理解_Widgets教程创建自定义挂件教程编写你自己的挂件教程也或帮助你学习如何创建挂件。

Dijit的_WidgetBase为创建挂件提供了优秀的基础架构,但是_TemplatedMixin混合类才是Dijit闪耀的所在。使用_TemplatedMixin和_WidgetsInTemplateMixin,你可以快速的创建可维护,快速修饰的挂件。

_TemplatedMixin的基础概念非常简单:它允许开发者创建一份有些小扩展的HTML文件,在运行的时候载入它并提供给挂件实例来使用。

让我们来看看_TemplatedMixin都定义了些什么(以及为什么),与使用它的功能如何构建一个简单的挂件。

注意_TemplateMixin意在作为混入类使用,不会直接用于继承。在基于类的语法中,它更像是接口(尽管在JavaScript中接口和类傻傻分不清)。在Dojo中类是如何工作的,请看Dojo声明教程

_TemplatedMixin提供了些什么

_TemplatedMixin为挂件提供了一个templateString属性,看起来十分简单,为什么如此强大的东西就这么点呢?答案就在于除此之外_TemplateMixin给你的挂架还添加了些什么。

小贴士:templatePath还存在,但不在用于载入模版了,它依然在那儿是为了向后兼容。后面我们会看到如何使用dojo/text!来载入挂件的模版。

时间: 2024-10-13 08:24:17

翻译 - 【Dojo Tutorials】Creating Template-based Widgets的相关文章

dojo 官方翻译 dojo/json 版本1.10

官方地址:http://dojotoolkit.org/reference-guide/1.10/dojo/json.html#dojo-json require(["dojo/json", "dojo/dom", "dojo/on", "dojo/domReady!"], function(JSON, dom, on){ on(dom.byId("convert"), "click",

dojo 官方翻译 dojo/_base/lang 版本1.10

官方地址:http://dojotoolkit.org/reference-guide/1.10/dojo/_base/lang.html#dojo-base-lang 应用加载声明: require(["dojo/_base/lang"], function(lang){ // lang now contains the module features }); clone() 克隆任何对象或者元素节点,返回:一个新的对象. require(["dojo/_base/lang

dojo 官方翻译 dojo/domReady 版本1.10

官方地址:http://dojotoolkit.org/reference-guide/1.10/dojo/domReady.html#dojo-domready dom加载完成后,执行. require(["dojo/domReady!"], function(){ // will not be called until DOM is ready }); 通常dojo/domReady没有也不需要设定一个返回值,而且,它是被放在加载模块数组的最后加载. require(["

dojo 官方翻译 dojo/string 版本1.10

官方地址:http://dojotoolkit.org/reference-guide/1.10/dojo/string.html#dojo-string require(["dojo/string"], function(string){ var a = string.pad("pad me", 10); var b = string.rep("dup", 10); var c = string.substitute("${repla

dojo 官方翻译 dojo/_base/array

官方地址:http://dojotoolkit.org/reference-guide/1.10/dojo/_base/array.html#dojo-base-array array模块dojo进行了很好的封装,如果想要调用必须先加载该模块: require(["dojo/_base/array"], function(array){ // array contains the features }); indexOf() 返回值:字符串在数组中第一次出现的位置,如果没有找到默认返回

翻译 - 【Dojo Tutorials】Creating Builds

Dojo的编译系统(build,后称编译)提供了一种编译Dojo和你的其他JavaScript代码与CSS文件的方式,让你的应用在生产环境可以高效的利用它们. “编译”Dojo或JavaScript? 如果你使用过其他编程语言,你也许会纳闷为什么我们要探讨Dojo或JavaScript的“编译”问题,因为编译通常意味着是将代码编译成机器语言.但是当我们谈论Dojo的编译时讲的是这么一个概念,将代码最小化,优化性能,代码串联与移除没用的代码. 每当你从服务器发送代码到客户端来解释执行时,如Java

OpenCV Tutorials —— Creating Widgets

Explanation Extend Widget3D class to create a new 3D widget. Assign a VTK actor to the widget. Set color of the widget. Construct a triangle widget and display it in the window. Code #include <opencv2/viz/vizcore.hpp> #include <opencv2/viz/widget

翻译 - 【Dojo Tutorials】Getting Started with Dojo Mobile

原文:Getting Started with Dojo Mobile web上的内容更新的飞快,重心很快就转移到移动设备上来了.就像对象web上的其他问题一样,Dojo对此也有解决方案:Dojo Mobile.Dojo Mobile是一个框架,可以让你轻松的构建设备兼容的web应用.这是关于Dojo Mobile系列教程的引导文章.通过对这一系列文章的学习,我们将构建一个叫做FlickView的Dojo Mobile应用.首先,我们应该先学习为什么既如何使用Dojo Mobile. Dojo

翻译 - 【Dojo Tutorials】Part 5 - Build FlickrView for production

原文:Part 5 - Build FlickrView for production 在前面的几篇文章中,我们通过编写HTML, CSS和JavaScript实现了这个FlickrView移动应用.本片文章将专注于为部署更新代码,利用Dojo的构建系统让生产环境应用保持紧凑,并回顾了整个Dojo Mobile驱动的应用. Dojo Mobile与构建 为Dojo Mobile应用创建一个构建版本是很重的,因为我们想要我们的应用尽可能的小.让我们看逐步了解一下如何创建我们Dojo Mobile应