ExtJS Grid 组件添加可点击文字按钮

可以使用renderer函数来自定义某一列的显示内容，并在其中添加一个文字按钮，并为该按钮添加点击事件。

具体步骤如下：

在列定义中添加renderer函数，在该函数中返回一个包含文字按钮的HTML元素：

columns: [{
    text: '操作',
    dataIndex: 'id',
    renderer: function(value, metaData, record) {
        return '<a href="#" class="my-button">点击</a>';
    }
}]

在grid的afterrender事件中为按钮添加点击事件：

listeners: {
    afterrender: function(grid) {
        grid.getEl().on('click', '.my-button', function(e) {
            e.preventDefault();
            var record = grid.getSelectionModel().getSelection()[0];
            // TODO: 处理点击事件
        });
    }
}

注意，这里使用了事件委托，将点击事件绑定在grid的el元素上，并指定了目标元素为class为my-button的元素。

在点击事件处理函数中，可以通过grid.getSelectionModel().getSelection()方法获取当前选中的行数据，然后进行相应的业务处理。

完整的代码示例：

Ext.create('Ext.grid.Panel', {
    renderTo: Ext.getBody(),
    store: {...},
    columns: [{
        text: '操作',
        dataIndex: 'id',
        renderer: function(value, metaData, record) {
            return '<a href="#" class="my-button">点击</a>';
        }
    }],
    listeners: {
        afterrender: function(grid) {
            grid.getEl().on('click', '.my-button', function(e) {
                e.preventDefault();
                var record = grid.getSelectionModel().getSelection()[0];
                // TODO: 处理点击事件
            });
        }
    }
});