2

我在使用 Dojo 文档时遇到了问题（像往常一样）。
在他们的TabContainer API上，他们将第二个参数列为一个名为“params”的对象，但他们从不说你可以在这个 params 对象中实际放入什么。我可以指定宽度吗？高度？我是否指定要成为容器内选项卡的 div 的 ID？

如果我想指定要由 Dojo 解析器解析的选项卡容器，也没有指定在 HTML 中放入哪些属性。我找到了以下示例，可以让您放置标题、选定和可关闭选项。还有别的事吗？

<div id="tabA1" dojoType="dijit.layout.ContentPane" title="First Tab"  selected="true" closable="true">
        First Tab
    </div>
    <div id="tabA2" dojoType="dijit.layout.ContentPane" title="Second Tab" closable="true">
        Second Tab
    </div>
    <div id="tabA3" dojoType="dijit.layout.ContentPane" title="Third Tab" closable="true">
        Third Tab
    </div>
</div>
4

1 回答 1

9

我不是 Dojo 小部件方面的专家，但这是我所知道的：

  1. 所有 Dojo 小部件构造函数都有签名：

    var widget = new Widget(params, node);

  2. 发现参数的最好方法是查看源代码——不要害怕，它们会在相关类的开头记录为变量。

  3. 使用小部件的名称通常很容易找到相关文件，因为它们是由它们的路径命名的。

  4. 查找这些内容的最佳方法是使用 Dojo 结帐和您最喜欢的文本编辑器。但夜间结账也有效（如果你跟着行李箱走）。或Trac 源代码浏览器。

  5. 不要低估查看测试和演示的力量。

示例：dijit.layout.TabContainer ⇒ dijit/layout/TabContainer.js。如果文件丢失，请查看 _base.js 的层次结构目录或一些类似的文件——后者可以将相关的类捆绑在一起。但在大多数情况下（例如使用 TabContainer），您会立即找到它。我们去看看。

类的顶部有两个公开的文档参数：

  • tabPosition — 字符串。定义选项卡相对于选项卡内容的位置。“顶部”、“底部”、“左-h”、“右-h”。默认值：“顶部”。
  • tabStrip — 布尔值。定义 tablist 是否获得额外的布局类。默认值：假。
  • _controllerWidget - 忽略它，没有公共参数以下划线开头 - 这是指定受保护成员的常见 JavaScript 约定。

但这还不是全部。TabContainer 基于dijit.layout.StackContainer（只需查看 dojo.declare() 标头）。我们也可以使用 StackContainer 的公共参数：

  • doLayout — 布尔值。如果为真，请更改我当前显示的孩子的大小以匹配我的大小。默认值：真。
  • 坚持——布尔值。跨会话记住选定的孩子。默认值：假。

正如您所看到的，代码和参数都有很好的文档记录，但并不总是反映在 API 工具中。现在我们可以放心地创建标签容器了。

但让我们先看看它的实际效果。所有 Dijit 测试始终位于dijit/tests中。任何 dijit.layout.* 小部件都将在dijit/tests/layout中进行测试。相关的测试文件将被命名为 test_TabContainer.html，实际上我看到了 5 个文件：

例如，让我们重新创建test_TabContainer.html的第一个 TabContainer ：

var tc = new dijit.layout.TabContainer(
  {persist: true, tabStrip: true}, "mainTabContainer");

或者我们可以像在测试内联中那样做：

<div id="mainTabContainer" dojoType="dijit.layout.TabContainer"
    persist="true" tabStrip="true" style="width: 100%; height: 20em;">
  ...
</div>

回到你原来的问题：现在你可以看到宽度和高度被简单地指定为样式，没有特殊属性，没有什么花哨的，只是一些直观的 C​​SS。因此，如果您想以编程方式执行此操作，只需在创建 TabContainer 的新实例之前将它们设置在节点上即可。

是的，我希望 API 文档也能获得所有这些小细节，但是整个设置很直观，并且相关部分都记录在文件中。我们确实去了源代码，但我们并没有试图破译源代码，只是阅读了类顶部的人类可读的注释。

于 2008-11-28T18:33:42.257 回答