何时调用DGrid.startup（） - 过早调用会导致渲染错误

Question

我对Dojo中的dgrid组件有些困难。我正在尝试构建一个包含dgrid的小部件。

dgrid渲染如下：

调整浏览器窗口大小后，一切正常，显示如下：

我认为我遇到的问题与过早调用grid.startup()函数有关。当我将对grid.startup()的调用延迟10秒（参见代码的注释部分）时，一切都按预期工作。

这是我的代码：

define([
        // ...
    ],
    function(
        // ...
    ) {
        return declare([_WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin] ,{
            templateString: template,

            startup: function(){

                this.inherited(arguments);
                var store = new Memory({data: this.someArray});
                var grid = new (declare([OnDemandGrid, DijitRegistry]))({
                    store: store,
                    columns: {
                        name: "Name column" 
                    }
                }, this.gridDiv);

                // If I wrap startup in this - everything is fine.  
                // window.setInterval(function(){
                grid.startup();
                // }, 1000*10);
            }
        });
    }
);

这是我正在使用的模板：

<div style="height:100%">
    <table border="1">
        <tr>
            <td>
                <button data-dojo-attach-point="addBtn" data-dojo-type="dijit/form/Button">Add item</button>
                <div data-dojo-attach-point="gridDiv"></div>

            </td>
            <td>
                Insert Summary here.
            </td>
        </tr>
    </table>
</div>

问题：这里发生了什么？我应该在哪里调用dgrid上的启动？

Answer 1

正如预期的那样，问题是过早调用启动方法 - 但是小部件本身没有问题。

遇到的问题是父窗口小部件。父窗口小部件（TabContainer）未正确启动。这就是父窗口小部件的工作方式：

1. 创建新的TabContainer：var tc = new TabContainer({...});
2. 创建新的ContentPane：var cp1 = new ContentPane({content: <the above widget>, ...});
3. 将ContentPane添加到TabContainer：tc.addChild(cp1);
4. 在TabContainer上调用启动：tc.startup();

将订单更改为此，解决了问题：

1. 创建新的TabContainer：var tc = new TabContainer({...});
2. 在TabContainer上调用启动：tc.startup();
3. 创建新的ContentPane：var cp1 = new ContentPane({content: <the above widget>, ...});
4. 将ContentPane添加到TabContainer：tc.addChild(cp1);