Question

如何将变量传递给扩展Ext.tree.Panel，而后者又会将其传递给自定义Ext.data.Store。

这是我的代码：

Ext.define('CustomStore', {
    extend: 'Ext.data.TreeStore',
    alias: 'widget.customstore',
    folderSort : true,
    model : 'TreeNode',
    autoLoad: true,
    config: {
        customParam: 'defaultVal'
    },
    ...
    proxy: {
        url: '/some/url?param'+this.customParam,
        ...
    }
});
Ext.define('CustomTree', {
    extend: 'Ext.tree.Panel',
    alias: 'widget.customtree',
    config: {
        customParam2: 'defaultVal'
    },
    store: new CustomStore({customParam: this.customParam2'}),
    ...
});

var tree = Ext.create('CustomTree', {customParam2: 'someVal'});

正如您所看到的，我想将值someVal传递给树，该树应该将其传递给商店，然后商店的代理需要将其提取并在其加载URL中使用。

尝试过很多事情，仅举几例：config，initConfig，constructor，initComponent但没有好结果。

Answer 1

你有正确的成分，但不要按正确的顺序混合它们。

这里的问题是您的商店创建代码：

new CustomStore({customParam: this.customParam2'})

在CustomTree的定义之前被称为：

Ext.define('CustomTree', ...)

这是因为new CustomStore(...)用作define函数的参数。因此，显然，它也会在设置customParam2的值的行之前调用：

var tree = Ext.create('CustomTree', {customParam2: 'someVal'});

因此，为了使其工作，您需要在调用CustomTree的构造函数时创建商店。但是在使用组件时，最好覆盖initComponent而不是构造函数。所以这就是你应该怎么做的：

Ext.define('CustomTree', {
    extend: 'Ext.tree.Panel',
    alias: 'widget.customtree',
    config: {
        customParam2: 'defaultVal'
    },
    // remove that
    // store: new CustomStore({customParam: this.customParam2'});

    // ... and put it in there:
    initComponent: function() {

        // creates the store after construct
        this.store = new CustomStore({customParam: this.customParam2});

        // call the superclass method *after* we created the store
        this.callParent(arguments);
    }
    ...
});

对于initConfig，您必须在构造函数中调用它，以便应用配置参数。但是在你的情况下，你从Ext.data.Store和Ext.tree.Panel延伸，他们的构造函数已经调用它，所以你不必自己动手。

将config传递给自定义Ext.tree.Panel，然后传递给自定义Ext.data.Store

1 个答案: