0

似乎选择事件没有通过自定义单元格渲染器传递。我的目标是我想更改网格中每个单元格的背景颜色(基于值),并且还能够处理选择事件。我在这里修改了文档中的示例:

https://www.telerik.com/kendo-react-ui/components/grid/selection/

在“订单上的单位”列中包含背景颜色。您会注意到该列不参与选择。我在这里创建了一个 stackblitz 示例:

https://stackblitz.com/edit/react-o4ycqi?file=app/main.jsx

我所做的只是添加了一个 cellWithBackground 函数并将其分配给 UnitsInStock 列。这是那个功能

const cellWithBackGround = props => {
 const examplePrice = true;
 const style = {
   backgroundColor: "rgb(243, 23, 0, 0.32)"
 };
 const field = props.field || '';
 return <td style={style}>
    {props.dataItem[field]}
    </td>;
};

我确实找到了一个很接近的示例,但我无法让它与功能组件一起使用。它只适用于我不使用的类。因此,请提供有关支持功能组件的示例或参考。

4

1 回答 1

0

H彼得,

感谢您分享代码。通过完全替换整个单元的基础设施,它将不再响应来自网格的任何内容。

具体来说,我指的是函数中的这一行。它只返回<td>带有字段名称的 a,它放弃了元素的其余属性。

//cell returned form the function
return <td style={style}>
    {props.dataItem[field]}
    </td>;

那时,它基本上是一个死细胞。它不会响应事件、数据操作等,因为它缺少 Grid 与之交互所需的所有部分。

进一步指导

正如我在Twitter 回复中提到的,您可以从这里获得剑道工程师的指导以帮助您。

我认为通过使用样式而不是直接手动处理 DOM 元素,有更好的方法来处理这个问题。至少,您需要归还单元的完整基础设施,他们可以提供帮助。

于 2021-05-21T19:14:58.683 回答