javascript - extjs5 小部件在单个单元格中列多个小部件

Question

我创建了一个小部件列作为其中几个组件的面板。如何将记录参数与这些组件链接？

例如：

{
    xtype: 'widgetcolumn',
    dataIndex: 'data',
    widget: {
        xtype: 'panel',
        height: 77,
        width: 642,
        layout: {
            type: 'vbox',
            align: 'stretch'
        },
        items: [
            {
                xtype: 'button',
                text: record.get('name')    //<<-- how can i link this record from the grid with this component?
            },
            {
                xtype: 'button',
                text: record.get('type')    //<<-- how can i link this record from the grid with this component?
            },
            {
                xtype: 'button',
                text: record.get('location')    //<<-- how can i link this record from the grid with this component?
            }
        ]
    }
}

我有以下商店：

var store = Ext.create('Ext.data.Store', {
     fields:['name', 'type', 'location'],
     data:[
          {name: 'name1', type: 'type1', location: 'loc1'},
          {name: 'name2', type: 'type2', location: 'loc2'}
     ]
});

也许，我可以通过渲染器功能访问记录？像这样的东西：

 renderer: function(value, meta, record) {
    //How can I get access to widget instance?
 }

Answer 1

我解决了这个问题。我们需要访问父元素——widgetcolumn，然后调用函数——getWidgetRecord。

{
xtype: 'label',
text: 'Some text...',
cls: 'gridcall-label-asgmt',
listeners: {
    resize: function(label) {
        var parent = label.up();
        while(typeof parent.up() !== 'undefined') {
            parent = parent.up();
        }   // --- while

        var record = parent.getWidgetRecord();
        if (typeof record === 'undefined') return;

        label.setText(record.data.asgmt, false);
    }   // --- resize
}   // --- listeners

}