You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

ag-grid是否支持mouseUp事件?项目需cellMouseUp事件仅找到同类其他事件

AG Grid 中实现 cellMouseUp 功能的方案

AG Grid 本身没有直接提供cellMouseUp专属事件,但可以通过两种方式实现对应需求:

  • 借助网格全局事件定位单元格
    监听网格的bodyMouseUp事件,在回调里用api.getCellForEvent(event)获取触发事件的单元格,示例代码:

    const gridOptions = {
      // 其他配置
      bodyMouseUp: (params) => {
        const targetCell = params.api.getCellForEvent(params.event);
        if (targetCell) {
          // 处理单元格鼠标松开逻辑
          console.log('鼠标松开于单元格:行索引', targetCell.rowIndex, '列ID', targetCell.column.colId);
        }
      }
    };
    
  • 自定义单元格渲染器绑定事件
    给需要监听的列配置自定义单元格渲染器,在渲染器内部为单元格元素绑定mouseup事件,示例代码:

    const CustomCellRenderer = {
      init(params) {
        this.eGui = document.createElement('div');
        this.eGui.textContent = params.value;
        this.eGui.addEventListener('mouseup', () => {
          // 执行鼠标松开后的操作
          console.log('单元格鼠标松开:行', params.rowIndex, '列', params.column.colId);
        });
      },
      getGui() {
        return this.eGui;
      }
    };
    
    // 列定义中使用该渲染器
    const columnDefs = [
      { headerName: '示例列', field: 'demoField', cellRenderer: CustomCellRenderer }
    ];
    

如果使用框架封装版(React/Vue/Angular),事件绑定方式需适配对应框架,但核心逻辑不变——要么通过全局事件定位单元格,要么在单元格内部直接绑定事件。

内容的提问来源于stack exchange,提问作者conghuang

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.25 21:12:30