Dojo数据属性

Question

最近我一直在研究Dojo作为jQuery和Backbone的替代方案。我喜欢它，但我唯一不喜欢的是Dojo使用HTML5数据属性。

我并不特别喜欢混合使用JavaScript和HTML，我宁愿将所有东西都完全分开。有没有办法用Dojo来做到这一点？

Answer 1

您可以选择是否以编程方式或声明方式编写小部件。在@BuffaloBuffalo给你的链接上比较两者的好处/差异。

• https://stackoverflow.com/a/19132588/1915448
• Difference between programmatically vs declaratively created widgets in dojo?

声明

HTML

<button data-dojo-type="dijit/form/Button">Click me</button> 

的JavaScript

require(["dijit/form/Button", "dojo/parser"]); 

您必须将parseOnLoad: true放入您的Dojo配置或使用dojo/parser模块API手动解析节点。

---

编程

HTML

<button id="myBtn">Click me</button> 

的JavaScript

require(["dojo/dom", "dijit/form/Button", "dojo/domReady!"], function(dom, Button) { 
    new Button({ 
     label: "Click me" 
    }, dom.byId("myBtn")); 
}); 

---

的差异是很清楚，但有一点要注意。正如你所看到的，声明性代码从按钮获取标签，这在使用以编程方式创建的小部件时不会发生。他们只使用DOM节点作为占位符，它不查看其属性或HTML属性。

---

但是，除了定义小部件之外，您可以使用数据属性做更多的事情。下面我将一一列举了，给你，你怎么能实现使用JavaScript同样的事情替代：

• data-dojo-config用来加载道场配置。此另一种方法是通过创建一个JavaScript文件和声明包含这些特性的dojoConfig全局对象。
• data-dojo-attach-point和data-dojo-attach-event用于创建连接点或引用从模板呈现的DOM节点。您可以通过使用dojo/query模块并通过查询您的小部件来获取正确的DOM节点/事件处理程序来实现同样的目的。domNode
• data-dojo-props为您提供了通过HTML5属性配置小部件属性的可能性。给它的替代方案是，以获得小窗口的参考并且使用set()功能。