dojo 获取当前view信息方式

在 Dojo 中，获取当前 View 的信息通常涉及以下几个方面：

1. View 的定义方式：是否使用 dijit/layout/ContentPane、dijit/layout/BorderContainer 或其他布局组件。
2. View 的管理方式：是否使用 dojo/router 或自定义的路由管理。
3. View 的激活状态：如何判断当前 View 是否处于激活状态。

以下是几种常见的获取当前 View 信息的方法：

---

1. 使用 dijit/registry 获取当前 View

如果 View 是通过 dijit 组件（如 ContentPane）实现的，可以通过 dijit/registry 获取当前 View 的信息。

示例：

require(["dijit/registry"], function(registry) {
  // 获取当前激活的 View
  const currentView = registry.getEnclosingWidget(document.activeElement);

  if (currentView) {
    console.log("View ID:", currentView.id);
    console.log("View Type:", currentView.declaredClass);
    console.log("View Title:", currentView.title);
  } else {
    console.log("No active view found.");
  }
});

---

2. 使用 dijit/layout/StackContainer 获取当前 View

如果 View 是通过 StackContainer 管理的，可以通过 selectedChildWidget 属性获取当前显示的 View。

示例：

require(["dijit/layout/StackContainer", "dijit/layout/ContentPane"], function(StackContainer, ContentPane) {
  const stackContainer = new StackContainer({}, "stackContainer");

  const view1 = new ContentPane({
    title: "View 1",
    content: "Content of View 1"
  });

  const view2 = new ContentPane({
    title: "View 2",
    content: "Content of View 2"
  });

  stackContainer.addChild(view1);
  stackContainer.addChild(view2);
  stackContainer.startup();

  // 获取当前显示的 View
  const currentView = stackContainer.selectedChildWidget;
  console.log("Current View ID:", currentView.id);
  console.log("Current View Title:", currentView.title);
});

---

3. 使用 dojo/router 获取当前 View

如果 View 是通过 dojo/router 管理的，可以通过路由信息获取当前 View。

示例：

require(["dojo/router"], function(router) {
  // 定义路由
  router.register("/view1", function() {
    console.log("View 1 is active.");
  });

  router.register("/view2", function() {
    console.log("View 2 is active.");
  });

  // 获取当前路由
  const currentRoute = router.getCurrentRoute();
  console.log("Current Route:", currentRoute);

  // 启动路由
  router.startup();
});

---

4. 使用 dojo/Stateful 管理 View 状态

如果 View 的状态是通过 dojo/Stateful 管理的，可以通过状态对象获取当前 View 的信息。

示例：

require(["dojo/Stateful"], function(Stateful) {
  const viewState = new Stateful({
    currentView: "view1"
  });

  console.log("Current View:", viewState.get("currentView"));

  // 监听 View 变化
  viewState.watch("currentView", function(name, oldValue, newValue) {
    console.log("View changed from", oldValue, "to", newValue);
  });

  // 更新 View
  viewState.set("currentView", "view2");
});

---

5. 使用 dojo/parser 解析动态 View

如果 View 是动态生成的，可以通过 dojo/parser 解析页面中的 View 信息。

示例：

require(["dojo/parser", "dojo/domReady!"], function(parser) {
  parser.parse().then(function(instances) {
    // 获取所有解析生成的 View
    instances.forEach(function(instance) {
      console.log("View ID:", instance.id);
      console.log("View Type:", instance.declaredClass);
    });
  });
});

---

6. 使用 dojo/query 获取 View 信息

如果 View 是通过 dojo/query 选择的，可以通过选择结果获取 View 信息。

示例：

require(["dojo/query", "dijit/registry"], function(query, registry) {
  // 选择所有 View 组件
  query(".view").forEach(function(node) {
    const view = registry.getEnclosingWidget(node);

    if (view) {
      console.log("View ID:", view.id);
      console.log("View Type:", view.declaredClass);
    }
  });
});

---

7. 在模板中绑定 View 信息

如果 View 使用模板定义，可以在模板中绑定 View 信息。

示例：

<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="title: 'View 1'">
  <span data-dojo-attach-point="titleNode">${title}</span>
</div>

在 View 代码中，可以通过 this.titleNode 访问模板中的节点。

---

总结

在 Dojo 中，获取当前 View 信息的方式取决于 View 的定义方式和管理方式。常见的方法包括：

• 使用 dijit/registry 获取 View。
• 使用 StackContainer 的 selectedChildWidget 属性获取当前显示的 View。
• 使用 dojo/router 获取当前路由对应的 View。
• 使用 dojo/Stateful 管理 View 状态。