道场:使用 registry.byID returns "undefined"

dojo: using registry.byID returns "undefined"

我在使用 dojo/registry 检索按钮小部件时遇到问题。

我有一个小部件,在它的 postCreate 函数中调用了一些其他函数。在最后一个 registry.byId() returns "undefined" 导致错误。 html-模板中确实存在具有所提供 ID 的元素。

我还在 JSFiddle 中创建了一个非常简单的工作版本,即使我在我的代码中尝试这个变体,我也会得到 "undefined"。 编辑: 已更新 Fiddle

这里是代码的简短摘要,其中包含 _setupButton 函数中最初使用 registry.byId() 以及 declare 部分之前的 JSFiddle 的解决方案.两个版本 return "undefined":

define(["dojo/_base/declare", "dojo/_base/array", "dojo/_base/lang", "dojo/dom-class", "dojo/number", "dojo/parser", "dojo/ready", "dojo/dom-construct", "dijit/registry", "dijit/form/NumberTextBox", "dijit/_Widget", "dijit/_TemplatedMixin", "dijit/Menu", "dijit/MenuItem", "dojo/text!./templates/template.html"],
function(declare, array, lang, domClass, number, parser, ready, domconstruct, registry, NumberTextBox, _Widget, _TemplatedMixin, Menu, MenuItem, templateStringContent) {

parser.parse();
ready(function () {
     console.info(registry.byId("startCalculationButton"));
});

return declare([_Widget, _TemplatedMixin],
{
    templateString: templateStringContent,

    postCreate() {
       this._setupButton();
    },
    _setupButton: function() {
       buttonWidget = registry.byId("startCalculationButton");
       buttonWidget.set("disabled", true);
    },
});

});

html 与提供的 JSFiddle-Snippet 相同。其他 id(对于 toher 元素)也不起作用。 那么为什么 registry.byId() 可能对我不起作用?我是 AMD 风格的新手,代码已经使用 dijit.byId.

使用旧语法

编辑:

我发现小部件没有在注册表对象中注册。这可能是什么原因?如果找不到模板,我会收到错误 404,因此我们可以排除这个原因。

编辑2:

另外 document.getElementById() 也只是 return null。我认为传递 templateString 就足够了,dojo 会做其他一切吗?

我注意到您的代码中有些地方可能需要特别注意:

require([
    "dojo/ready",
    "dijit/registry"
], function(
    ready,
    dijitRegistry
) {
    ready( function() {
        var grid = dijitRegistry.byId("startCalculationButton");
        console.info(grid)
        grid.set("disbaled", true);
    });
});

我觉得应该是: require(["dojo/ready", "dijit/registry"], function(ready, registry) { ... } 然后你可以使用 registry.byId("somename")

如果您在 require 语法上使用 dgrid/extensions/DijitRegistry, 那么你应该在你的 require 语法之后包含 DijitRegistry (请提醒,它区分大小写),但根据我的经验,我只将它用于 dgrid mixin ...

希望这可以帮助...

根据 dojo documentation 小部件需要 _TemplatedMixin_WidgetsInTemplateMixin 并从中继承:

But what if we want to have a widget inside of the template, as in:

<div class="combinedDateTime">
   <div data-dojo-type="dijit/form/DateTextBox"></div>
   <div data-dojo-type="dijit/form/TimeTextBox"></div>
</div>

When using this template in a directly extended widget class, you will need to mixin dijit._WidgetsInTemplateMixin in addition to dijit._TemplatedMixin.

由于 dijit-button 将成为我模板中的一个小部件,因此添加 _WidgetsInTemplateMixin 并从中继承解决了我的问题,而无需进行其他更改。我的代码现在看起来像这样(缩短):

define(["dojo/_base/declare", "dijit/registry", "dijit/_Widget", "dijit/_TemplatedMixin", "dijit/_WidgetsInTemplateMixin", "dojo/text!./templates/template.html"],
function(declare, registry, _Widget, _TemplatedMixin, _WidgetsInTemplateMixin, templateStringContent) {

return declare([_Widget, _TemplatedMixin, _WidgetsInTemplateMixin],
{
    templateString: templateStringContent,

    postCreate() {
       this._setupButton();
    },
    _setupButton: function() {
       buttonWidget = registry.byId("startCalculationButton");
       buttonWidget.set("disabled", true);
    },
});