Установите рендеринг для столбца одним нажатием кнопки

Question

Я хочу создать кнопку, которая, когда я нажму на нее, установит renderer для column на моей сетке. Я просматриваю API для столбцов http://docs.sencha.com/extjs/5.1/5.1.1-apidocs/#!/api/Ext.grid.column.Column

и я не вижу способ, который говорит setRenderer, как я могу это достичь?

Edit: Я не хочу, чтобы установить его, когда я создаю столбец (я знаю, есть свойство, чтобы установить рендерер)

Answer 1

Вы можете попробовать просто изменяя визуализатор, нет необходимости в setRenderer

Ext.create('Ext.data.Store', { 
    storeId: 'simpsonsStore', 
    fields:[ 'name', 'email', 'phone'], 
    data: [ 
     { name: 'Lisa', email: 'lisa@simpsons.com', phone: '555-111-1224' }, 
     { name: 'Bart', email: 'bart@simpsons.com', phone: '555-222-1234' }, 
     { name: 'Homer', email: 'homer@simpsons.com', phone: '555-222-1244' }, 
     { name: 'Marge', email: 'marge@simpsons.com', phone: '555-222-1254' } 
    ] 
}); 

Ext.create('Ext.grid.Panel', { 
    title: 'Simpsons', 
    store: Ext.data.StoreManager.lookup('simpsonsStore'), 
    columns: [ 
     { text: 'Name', dataIndex: 'name', 
     renderer: function (value) { 
      return value + ' Simpson'; 
     }}, 
     { text: 'Email', dataIndex: 'email', flex: 1 }, 
     { text: 'Phone', dataIndex: 'phone' } 
    ], 
    height: 400, 
    width: 400, 
    renderTo: Ext.getBody(), 
    bbar: [{ 
     text: 'Change First Column Renderer', 
     handler: function(b) { 
      var grid = b.up('grid'), 
       columns = grid.getColumnManager().getColumns(), 
       column = columns[0]; 

      column.renderer = function(value) { 
       return value === 'Lisa' ? 'L Simpson' : value; 
      } 
      grid.view.refreshView(); 
     } 
    }] 
}); 

Fiddle: https://fiddle.sencha.com/#fiddle/1a5e