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

【问题标题】：How to access the class function inside ag-grid cell renderer function如何访问 ag-grid 单元格渲染器函数中的类函数
【发布时间】：2017-09-10 23:11:45
【问题描述】：

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

【问题讨论】：

标签： ag-grid ag-grid-react

【解决方案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);
}

【讨论】：