订阅者（小部件）

Question

我正在使用Dojo 1.9作为我正在使用WebSockets编写的Web应用程序。当客户端从服务器收到消息时，我需要使用收到的数据更新某些小部件。

// sock is the client-side of the websocket
sock.onmessage = function (dataIn) {
    // clientManager defined elsewhere
    clientManager.fireMessageReceived(dataIn);
};

这是我的问题：在我收到数据时，我没有ID，DOM节点或小部件来访问要更新的属性/值。 clientManager专门处理sock事件，并且没有任何关于其数据将更新的小部件的具体知识。此外，可能有相同小部件的多个实例，因此我认为尝试维护现有小部件（或ID）的集合作为客户端管理器的属性可能会很快变得毛茸茸。

所以，我的解决方案是使用CSS类。

我创建了一个空类并将其分配给我的小部件：

.myXYZWidget {

}

因此，在我的fireMessageReceived函数中，我可以使用dojo/query来查找它：

var myXYZWidgets = dojo.query(".myXYZWidget");
var i;

for (i = 0; i < myXYZWidgets.length; i++) {
    var xyzWidget = registry.byNode(myXYZWidgets[0]);

    ... // Now I have my Dojo widget, I can upate to my heart's content
}

这有效，我没有看到这样做的任何重大缺点，但这是好的还是坏的坏事？社区中对Dojo有所了解的人是否可以确认此解决方案或建议更好的解决方案？

Answer 1

一个类不一定是CSS。因此，您不是使用CSS来获取Dojo小部件，而只是通过选择器/查询来访问小部件。

如果我考虑一下你的问题，我会考虑你的websocket是你的发布者的发布者/订阅者模式（因为它接收数据并需要将它发送到你的小部件），你的小部件就是你的订阅者。

订阅者（小部件）

幸运的是，dojo有一些东西，它被称为 dojo / topic 模块。当您创建窗口小部件时，您想要确保它是您的websocket接收的数据的订阅者。要做到这一点，我会做这样的事情（我在我的例子中使用dijit/form/Select，但你可以将它重写为你想要的任何东西）：

lang.mixin(mySelect, {
    __getData: function(data) {
         this.addOption(data);   
    }
});
mySelect.own(topic.subscribe("my/event", lang.hitch(mySelect, '__getData')));

这里发生的事情很简单（尽管看起来很难）。我要做的第一件事是确保我的小部件有一个名为__getData的额外方法。此方法将从websocket接收数据，并将根据数据更新自己的数据。

然后我确保小部件订阅名为 my / event 的活动（您将在一段时间内看到这意味着什么）。

Publisher（websocket）

然后在您的websocket代码级别，您希望发布一个名为 my / event 的主题，以便您的小部件知道它。

你可以这样做：

topic.publish("my/event", myData);

myData是您从websocket收到的数据。

所以现在流程已经完成。您的websocket代码将向想要收听的人发送数据。监听器（小部件）将使用数据并对其执行某些操作，例如向自己添加项目。

我还发了一个JSFiddle来展示一个完整的例子。这个解决方案可能看起来更复杂，但我认为它在实际上更正确。

使用类选择器获取Dojo小部件：好还是坏？

1 个答案:

订阅者（小部件）

Publisher（websocket）