让每个Widget都有插件机制:新的data-dojo-mixins属性
插件机制是建立灵活可扩展应用的一个最佳实践,而现在Dojo通过这个全新的属性全面实现了插件机制,让Dojo的Widget在使用时可以灵活决定自己需要的特性。因为这个属性的存在,Widget的开发也将可以更加模块化,每一组功能都能独自定义。在使用的时候,根据具体的使用场景,来决定是否启用此功能。比如,在dojox中提供了最近较为流行的TreeMap组件。模块dojox/treemap/TreeMap本身仅仅包含了最基础的功能。而对于键盘支持,色块拆分等功能则通过可插拔的模块来实现:dojox/treemap/Keyboard和dojox/treemap/DrillDownUp模块。这样的附属模块可以理解为插件,按照需要将其添加到data-dojo-mixins属性中即可开启相应的功能。
<div data-dojo-type="dojox/treemap/TreeMap" data-dojo-mixins="dojox/treemap/Keyboard,dojox/treemap/DrillDownUp"></div>
在这里,data-dojo-mixins属性中用逗号隔开的模块就可以看成一个个插件。不仅新控件可以利用插件机制,为现有组件添加新的功能,也可以通过提供插件来实现。比起派生一个新类来实现此功能,插件是可以通用的。例如:假设要为dijit/form下的TextBox,Select等表单控件添加语音识别的功能,可能只需要写一个my/voice/Recognizer模块,这样具有set('value',value)这样接口的Widget都将能灵活选用这个组件,而不需要为每个Widget都派生一个新的类。而对于多个插件的功能组合,则更显然data-dojo-mixins会非常合适。
现在看到的是声明方式创建的Widget我们可以很好的利用data-dojo-mixins实现插件机制。那么对于动态创建的Widget呢?其实这1.8之前已经可以实现:
var treemap = new (declare(['dojox/treemap/TreeMap','dojox/treemap/Keyboard','dojox/treemap/DrillDownUp']))(arguments);
模块的灵活性,一直是Dojo的重点关注。从引入AMD开始,Dojo就提出了base-less的概念,即Dojo框架可以配置为没有任何核心库,所有的模块都按需加载。这要求每个模块提供的功能独立而精简,从而能够实现最终仅仅加载需要的代码的目的。而data-dojo-mixins属性则是可以帮助我们将功能拆分并模块化到极致。这在目前JavaScript代码普遍臃肿的大环境下无疑是一个让人眼前一亮的概念和做法。
========================
清单 20. 对话框内容 (dialog-data.html)
<div class="mblSimpleDialogTitle">Rain Alert</div> <div class="mblSimpleDialogText">Do you have an umbrella?</div> <button data-dojo-type="dojox.mobile.Button" onclick="hide('dlg1')">No</button> <button data-dojo-type="dojox.mobile.Button" onclick="hide('dlg1')">Yes</button>
使用 _ContentPaneMixin 加载对话框内容,如 清单 21 中所示:
清单 21. 加载外部对话框内容
<div id="dlg1" data-dojo-type="dojox.mobile.SimpleDialog" data-dojo-mixins="dojox.mobile._ContentPaneMixin" data-dojo-props='href:"dialog-data.html"'></div>
清单 21 中的示例使用 data-dojo-mixins 属性,动态地将 dojox.mobile.ContentPane 的功能添加到 SimpleDialog 中,这也是 Dojo 1.8 中的一个新特性。
原文链接:https://www.f2er.com/dojo/291043.html