ag-grid - 如何访问 ag-grid 单元格渲染器函数中的类函数

Question

class abc extends React.Component{
_handleClick(){
console.log("some API call and state change");
}
}

columndefs: [
        {headerName:'Label', field: 'label', width:130, pinned:'left', cellClass:'ag-cell-text-align-center', cellRenderer:linkRenderer},
        {headerName:'Received', field: 'receivedDate', width:130, cellClass:'ag-cell-text-align-center'},
]

function linkRenderer(){
return params.data.link ? `<span style=text-decoration:underline;color:blue;cursor:pointer onClick="this._handleClick()">${params.value}</span>`: params.value;
}

这说明“this._handleClick 不是函数”所以，如何在 linkRenederer 中调用 this._handleClick

Answer 1

我在您的代码中看到了几个语法问题。例如：样式应该是一个对象。而且您不应该那样使用 onClick 。尝试这样的事情：

<span 
    style={{ textDecoration: "underline", color: "blue", cursor: "pointer" }} 
    onClick={ this._handleClick }>
    {params.value}
</span>

还要在构造函数中绑定方法

constructor(props){
    super(props);
    this._handleClick = this._handleClick.bind(this);
}