访问模板化小部件外部的 dojo 附加点

Posted 2023-02-16

【中文标题】访问模板化小部件外部的 dojo 附加点

【英文标题】：accessing dojo attach point outside templated widget

【发布时间】：2013-08-29 10:03:26

【问题描述】：

我有一个用于列表项的 dojo 附加点，它位于模板化小部件内部。我需要访问小部件外部的 dojo 附加点，以便将 onclick 分配给由模板创建的列表项。我该怎么做？

【参考方案1】：

好吧，如果你想给它附加一个事件处理程序，你必须提供一个函数。您可以使用 getter 和 setter 从外部覆盖函数/属性。

如果您只需要节点来附加事件处理程序，我还建议使用data-dojo-attach-event。例如，使用：data-dojo-attach-event="onclick: myFunction"。通过这样做，它需要在您的模板小部件中调用一个名为 myFunction 的函数，提供一个默认函数（在您的小部件中），例如：

myFunction: function() 
    /** Stub */
,

然后你可以从外面做这样的事情：

myWidget.set("myFunction", function(evt) 
     console.log("Someone clicked on the list item");
);

因为myFunction事件处理函数被覆盖了，它会执行setter中提供的函数。

您也可以使用以下方式直接从外部访问连接点：

myWidget.listItemNode

当你有一个data-dojo-attach-point="listItemNode"。但是，我认为不建议以这种方式使用它，因为现在您的小部件是紧密耦合的（您使用小部件的内部功能）。

【讨论】：

除了替换原来的myFunction，你还可以使用dojo/aspect来添加行为而不影响其默认实现。

这也是一种可能，但我通常有一个名为_myFunction 的函数，默认实现和myFunction 可以被覆盖。在我的示例中，我展示了myFunction 是可能被覆盖的公共 API 的一部分的情况。

【参考方案2】：

html template:-
 <div data-dojo-attach-point="infoDialog" >
 </div> 
Save this as "Template.html"
---------------------------------------------
load this html file using "dojo\text" plugin in your widget i.e.  
"dojo/text!./templates/Template.html",
and store as template in widget main function 
-----------------------------------------------
assign it as template string to the widget.

templateString: template,

now this template attachpoint(infoDialog) will be the part of your current widget scope.
-----------------------------------------------
attach event:-

this.infoDialog.onclick=function()
   alert("hello world")
; 

【讨论】：

这是使用节点的好方法吗？通过这种方式使用它，您将依赖于 outside 小部件的小部件模板。所以实际上你正在使用小部件的内部 API。这使得您的小部件使用附加点与其他脚本紧密耦合，而您应该努力实现松散耦合的设计。