javascript - 渲染的输入文本框不响应箭头键

Question

{ 
    headerName: "Total", 
    field: "total", 
    cellRenderer: (params) => {
         var box = document.createElement("input");
         box.type = "text";
         box.value = "inverse";
         return box;
    }
}

上面的代码将渲染一个输入框，但问题是当我在输入字段内按箭头键时，光标没有在输入框中移动，(我必须使用鼠标单击才能进入输入框中的第二个位置)。然而空格和退格键仍然有效。这是 ag-grid 的问题吗？非常感谢任何帮助

Answer 1

默认情况下，在使用自定义编辑器时，网格将处理箭头键和输入(以及转义)键来停止编辑给定单元格。

您可以通过监听关键事件并对其采取行动来覆盖此设置:

MoodEditor.prototype.onKeyDown = 函数(事件){
var key = event.which ||事件.keyCode;
if (key == 37 ||//左
键== 39) {//右
this.toggleMood();
event.stopPropagation();
}
};


参见https://www.ag-grid.com/javascript-grid-cell-editor/exampleEditorComponent.html有关此的工作示例(情绪栏)