如何生成视图，点击ExtJS中的树列表节点后

Question

我有一个Extjs项目，文件如下：

应用程序：

->view->main->MainController.js

->查看->类别->类别Controller.js

经典：

->查看

->main->main.js

->categories.js

我使用树列表。

现在，当用户点击树列表节点时，我想要一个生成视图。例如：当点击类别节点时，生成category.js视图。

我该怎么做

Answer 1

您需要将侦听器与treelist关联，以处理用户的单击事件（在包含treelist的视图上）。您可以监听selectionchange事件。

{
  xtype: 'treelist',
  store: 'NavigationTree',
  listeners: {
    selectionchange: 'onNavigationTreeSelectionChange'
  }
}

在onNavigationTreeSelectionChange处理程序（视图控制器上）上，需要根据单击的节点属性创建新视图。类似于：

onNavigationTreeSelectionChange: function (tree, node) {
    console.log('onNavigationTreeSelectionChange');
    var tp = this.getPlanPresentationBar();
    var newView;
    if (node && node.get('extjsview')) {
        switch (node.get('extjsview')) {
            case 'Category':
                newView = new MyApp.view.Category({});
                break;
            case 'sync.Sync':
                newView = new MyApp.view.sync.Sync({});
                break;
            default:
                break;
        }
        tp.add(newView);
    }
},

在这个例子中，我们使用节点的属性extjsview来知道要创建哪个视图（如果检查用户是否单击了Category节点）。在示例代码中，newView被添加到现有的选项卡面板中，但它实际上取决于应用程序的其余部分。

正如Tarabass已经提到的，您应该查看Dashboard示例。