Question

我正在使用React Grid组件，我正在寻找一种双击一行时触发函数的方法。

我找到了rowClick函数，我现在可以使用它来选择行或处理onClick事件：<Grid rowClick={e => yourFunction(e)}>。但是没有处理doubleClick事件的功能。

这是我的方法，我将onDoubleClick()函数作为道具传递给我的组件，并将其与doubleClick的{{1}}的监听器绑定到每一行：

componentDidMount

暂时可行，但我无法将点击的行数据传递给我的函数。是否有使用该元素检索行数据的hack？像这样的例子：onDoubleClick（kendo.data.DataSource（rows [i]））=＆gt;返回json数据。

Answer 1

网格具有rowRender属性，可以用作RenderProp来完全修改行，包括使用本机React方法将它们附加到rowClick。

rowRender(trElement, dataItem) {
    const trProps = {
        ...trElement.props,
        onDoubleClick: () => {
            //place your logic here
        }            
    };
    return React.cloneElement(trElement, { ...trProps }, trElement.props.children);
}

您可以在InCell editing demo中找到关于如何为GridRow附加鼠标mousedown，模糊和焦点的实例。可以使用onDoubleClick的相同逻辑，就像我上面的代码一样。

双击Rendo Component的Kendo Grid行

1 个答案: