Question

我有两个js文件，maincomp和nestedcomp。 nestedcomp将用作可重用的组件，这就是为什么我需要向其发送参数。这个maincomp文件：

Ext.define('mycomponents.maincomp', {
    extend: 'Ext.window.Window',

    itemId: 'maincomp',
    xtype: 'maincomp',

    modal: true,
    bodyPadding: 10,
    height: 350,
    width: 270,
    closeAction: 'destroy',
    resizable: false,
    renderTo: Ext.getBody(),

    requires: [
        'mycomponents.nestedcomponent'
    ],

    layout: {
        type: 'table',
        columns: 1
    },

    items: [
        {
            xtype: 'textfield',
            fieldLabel: 'Name',
            name: 'name',
            labelAlign : 'right',
            width: 265,
            allowBlank: false
        },
        {
            xtype: 'textfield',
            fieldLabel: 'Age',
            name: 'age',
            labelAlign : 'right',
            width: 265,
            allowBlank: false
        }
        {
            xtype: 'nestedcomp'
        }
    ]
});

这是我的nestedcomp文件：

Ext.define('mycomponents.nestedcomponent', {
    extend: 'Ext.container.Container',

    id: 'nestedcomp',
    xtype: 'nestedcomp',

    items: [
        {
            xtype: 'textfield',
            fieldLabel: 'Address',
            name: 'address',
            id: 'address',
            labelAlign : 'right',
            width: 265,
            allowBlank: false
        }
    ],

    constructor: function (config) {
         this.callParent(arguments);
         this.initConfig(config);
         return this;
   },

    initComponent: function () {

    }

});

也许这是一个非常幼稚的问题，但问题是我不知道如何将参数从maincomp传递到nestedcomp。我进入了官方文档，并在google上找到了答案，但是我无法找到解决方案来实现这一目标，所以我的问题是如何将参数从一个组件传递到其嵌套组件中？

Answer 1

我通常将额外的参数传递给initComponent中的嵌套组件：

Ext.define('mycomponents.maincomp', {
    extend: 'Ext.window.Window',

    itemId: 'maincomp',
    xtype: 'maincomp',

    modal: true,
    bodyPadding: 10,
    height: 350,
    width: 270,
    closeAction: 'destroy',
    resizable: false,
    renderTo: Ext.getBody(),

    requires: [
        'mycomponents.nestedcomponent'
    ],

    layout: {
        type: 'table',
        columns: 1
    },

    initComponent: function () {
        this.items = [
            {
                xtype: 'textfield',
                fieldLabel: 'Name',
                name: 'name',
                labelAlign : 'right',
                width: 265,
                allowBlank: false
            },
            {
                xtype: 'textfield',
                fieldLabel: 'Age',
                name: 'age',
                labelAlign : 'right',
                width: 265,
                allowBlank: false
            },
            {
                xtype: 'nestedcomp',
                abc: this.xyz
            }
        ];
        this.callParent(arguments);
    }
});

或者我只是在ViewController的此视图上执行某种方法，例如form.loadRecord(r)，form.setValues(v)，其中，表单是呈现视图后的Ext.form.Panel。

extjs如何将参数从容器传递到嵌套容器

1 个答案: