Extjs4 中的 setRenderer() 方法答案

【问题标题】：setRenderer() method in Extjs4Extjs4 中的 setRenderer() 方法
【发布时间】：2011-05-26 04:06:53
【问题描述】：

Extjs 3.3.1 拥有setRenderer() 方法

/**
  * Sets the rendering (formatting) function for a column. 
  */
setRenderer( Number col, Function fn ) : void

现在我在ExtJS 4 的setRenderer 中没有任何方法。那么如何在ExtJS 4 中在运行时格式化网格列。

【问题讨论】：

我有疑问，如果你有聊天权限look this

标签： extjs extjs4

【解决方案1】：

当您创建网格时，您可以在每一列上定义渲染器...

Ext.create('Ext.grid.Panel', {
    title: 'Grid Sample',
    store: Ext.data.StoreManager.lookup('yourStore'),
    columns: [
        {header: 'Product Description',  dataIndex: 'description'},
        {header: 'Cost', dataIndex: 'cost', renderer: nameOfRenderFunction },
    ],
    height: 200,
    width: 400,
    renderTo: Ext.getBody()
});

然后您可以在全局范围内定义您的函数...

function nameOfRenderFunction(v) {
    //do something to v
    return v;
}

【讨论】：

感谢您的回答，但我想更改曾经渲染过且不破坏网格的网格列。意味着我有两个网格，我想更改第一个网格列的 itemClick 或 cellClick 上的第二个网格列。＆我有一个重新配置到 Extjs 中的 GridPanel 的方法。 reconfigure( Ext.data.Store store, Array columns ) : void 用新的存储/列重新配置表。如果您不想更改存储或列，则可以省略它们。参数 store : Ext.data.Store 新存储。 columns : Array 列配置数组返回 void
我在Ext.grid.Panel 中没有看到reconfigure 方法？不过Ext.panel.Table 中有一个。
我们也可以将它用于GridPanel。即 gridPanel.reconfigure(store,columns);

【解决方案2】：

我所做的是事后设置渲染器。在我的应用程序启动后，我得到了实例化的组件并在我的控制器的 onLaunch() 函数中添加了一个渲染器，如下所示：

    // An example renderer
    var myComponentsRenderer = function( value ){
        return value++;
    };

    // Get the instantiated component
    var myComponent = Ext.ComponentQuery.query( "#myComponent" )[0];

    // Attach the renderer
    Ext.override( myComponent, {
        renderer : myComponentsRenderer,
    });

我喜欢这种方法的原因是因为我能够将渲染器功能放在我的控制器中，并将逻辑置于我的视野之外。它可以帮助我更好地组织我的代码。

【讨论】：

【解决方案3】：

看起来像在this post on the sencha forum中提到的方法。

您可以使用grid's reconfigure method 来交换不同的列列表（连同渲染器），但这确实有一个主要缺点，您必须完全重新指定列。

你找到更好的方法了吗？我真的不喜欢它迫使您将渲染器放在无法测试且无法以非静态方式访问状态的地方。

但是，在这种情况下，治疗似乎比疾病更糟糕，因为您最终会将非常明确的视图代码排除在视图之外。

有时感觉他们并没有真正考虑过这些东西的设计:(

【讨论】：