Question

我认为，默认渲染器总是将其调用对象称为范围。我们不必定义任何东西，但在我的网格中我有不同的行为。

我必须定义渲染函数运行时。

我创建了列对象，并为每个列指定了渲染器。

for (var i = 0; i < columns.length; i++) {
      newRenderer = function (v, m, r, rI, cI, s)
      { 
           if(this.originalRend)  <<<<<-----------------
           // "this" is not object of column but whole page.
           { 
                 //then call original} 
           else {
                 // call new renderer
           }
      }
      columns[i].originalRend = columns[i].renderer;
      columns[i].renderer = newRenderer;
}

在我的newRenderer函数中，“THIS”不引用列对象。为什么？？？？？以及如何做到这一点????

Answer 1

您应该能够使用scope作为列的配置选项，并且渲染器将使用该选项：

{
    renderer: function(val){
        return val.trim();
    },
    scope: this
}

或者，就您的代码而言：

for (var i = 0; i < columns.length; i++) { 
    newRenderer = function (v, m, r, rI, cI, s)
    { 
         if(this.originalRend)  <<<<<-----------------
         // "this" is not object of column but whole page.
         { 
             //then call original} 
         else {
             // call new renderer
         }
    }
    //THIS LINE ADDED:
    columns[i].scope = columns[i];
    columns[i].originalRend = columns[i].renderer;
    columns[i].renderer = newRenderer;
}

请参阅此处的文档：http://docs.sencha.com/extjs/4.1.3/#!/api/Ext.grid.column.Column-cfg-scope

Answer 2

范围不能用作列或此列。最好的方法是覆盖header container的prepareData方法。

Ext.override(Ext.grid.header.Container, {
prepareData: function(data, rowIdx, record, view, panel) {
        //console.log("we r in prepare Data");
        var me        = this,
            obj       = {},
            headers   = me.gridDataColumns || me.getGridColumns(),
            headersLn = headers.length,
            dirtyCls = me.dirtyCls,
            colIdx    = 0,
            header,
            headerId,
            renderer,
            value,
            metaData,
            store = panel.store;

        for (; colIdx < headersLn; colIdx++) {
            metaData = {
                tdCls: '',
                style: ''
            };
            header = headers[colIdx];
            headerId = header.id;
            renderer = header.renderer;
            value = data[header.dataIndex];

            if (typeof renderer == "function") {
                value = renderer.call(
                    //--------change made below.------------------
                    header.scope || header || me.ownerCt, 
                    //----------------end-------------------------
                    value,
                    // metadata per cell passing an obj by reference so that
                    // it can be manipulated inside the renderer
                    metaData,
                    record,
                    rowIdx,
                    colIdx,
                    store,
                    view
                );
            }

            // <debug>
            if (metaData.css) {
                // This warning attribute is used by the compat layer
                obj.cssWarning = true;
                metaData.tdCls = metaData.css;
                delete metaData.css;
            }
            // </debug>
            if (me.markDirty) {
                obj[headerId + '-modified'] = record.isModified(header.dataIndex) ? dirtyCls : '';
            }
            obj[headerId+'-tdCls'] = metaData.tdCls;
            obj[headerId+'-tdAttr'] = metaData.tdAttr;
            obj[headerId+'-style'] = metaData.style;
            if (typeof value === 'undefined' || value === null || value === '') {
                value = header.emptyCellText;
            }
            obj[headerId] = value;
        }
        return obj;
    },

}

Extjs，定义列的渲染器函数的范围

2 个答案: