ExtJS 4 TreePanel自动加载 [英] ExtJS 4 TreePanel autoload

问题描述

我有一个Ext.tree.Panel，其中有一个TreeStore.该树在选项卡中.问题是，即使存储位于autoLoad: false上，当我的应用程序加载应用程序中使用的所有树时，它们也会加载其数据.

I have an Ext.tree.Panel which is has a TreeStore. This tree is in a tab. The problem is that when my application loads all of the trees used in the application load their data, even though the store is on autoLoad: false.

如何防止在树上自动加载?

How could I prevent autoloading on the tree?

Ext.define('...', {
    extend: 'Ext.container.Container',
    alias: 'widget.listcontainer',
    layout: {
        type: 'vbox',
        align: 'stretch'
    },
    items: [{
        xtype: 'container',
        html: "...",
        border: 0
    }, {
        xtype: '...',
        flex: 1,
        bodyPadding: 5,
        margin: '9 0 0 0'
    }]
});

Ext.define('...', {
    extend: 'Ext.data.TreeStore',
    model: '...',
    proxy: {
        type: 'ajax',
        reader: {
            type: 'json',
            root: 'data'
        },
        api: {
            read: 'some url'
        }
    }
});

Ext.define('...', {
    extend: 'Ext.tree.Panel',
    alias: 'widget....',
    id: '...',
    title: '...',

    height: 400,
    collapsible: true,
    useArrows: true,
    rootVisible: false,
    multiSelect: true,
    singleExpand: true,
    autoScroll: true,
    store: '...',

    columns: [...]
});

P.S.我发现如果在树上将rootVisible更改为true，则不会发生此问题，但是会显示到根节点(我不想要).

P.S. I've found out if I change rootVisible to true on the tree this problem doesn't happen, but then it shows to root node(which I don't want).

推荐答案

如果root是不可见的，则AJAX树将自动加载第一级层次结构(您已经自己证明了).

If root is invisible then AJAX tree will automatically load first level of hierarchy (as you already proved by yourself).

我认为最好的方法是使根可见或在执行某些操作后创建树.我编写了防止AJAX请求加载数据的代码:

I think the best way is to make root visible or create tree after some actions. I wrote code that prevent AJAX request that loads data:

var preventTreeLoad = true;

store.on('beforeexpand', function(node) {
    if (node == this.getRootNode() && preventTreeLoad) {
        Ext.Ajax.abort(this.proxy.activeRequest);
        delete this.proxy.activeRequest;
    }
}, store);

var b = Ext.create('Ext.Button', {
    text: 'Click me',
    renderTo: 'btn',
});

b.on('click', function() {
    preventTreeLoad = false;
    this.load();
}, store);

但是我不建议使用这种方法.例如，如果javascript并不是那么快-可能会发送Ajax请求(不会读取响应，但服务器将执行操作).

But I'm not recommended to use this approach. For example, if javascript wasn't so fast - Ajax request may be send (response will not be read but server will execute operation).

这篇关于ExtJS 4 TreePanel自动加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！