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

Question

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

应用程式：

->视图->主-> MainController.js

->视图->类别-> CategoriesController.js

经典：

->查看

->主-> Main.js

->类别-> Categories.js

我为此使用树列表。

现在，我希望当用户单击树列表节点时生成视图。 例如：单击类别节点时，生成Category.js视图。

我怎样才能做到这一点？

Answer 1

您需要将侦听器与treelist相关联，以处理用户的click事件（在包含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示例 。