ag-grid设置选中单行多行及获取选中行数据
ag-Grid 是比较实用的数据表格组件，最近接触到了相关的项目，简单记录一下设置选中单行多行和获取选中行数据的方法。
?
设置多行选中
rowSelection 行选择的类型，设置为 'single' 或者 'multiple' 启用单选和多选。
const?gridOptions?=?{
??headerHeight:?40,
??rowSelection:?'multiple',?//?单选?single?|?多选?multiple
??suppressContextMenu:?true,
}获取选中行数据
绑定 ref?
const?gridRef?=?useRef();
<AgGridReact
????ref={gridRef}
????//...
/>获取数据
const?rows?=?gridRef.current.getSelectedRows();
if?(rows?&&?rows.length)?{
??//?得到一个数组，如果是多选，会显示多条
??//?如果是单选，直接去下标是?0?的数据即可
??console.log(rows[0])
}?else?{
??alert('请选择一条数据！');
}可以根据自己的需求，进行更进一步的扩展。
未经允许不得转载：w3h5-Web前端开发资源网 ? ag-grid设置选中单行多行及获取选中行数据
本文参与?腾讯云自媒体分享计划，分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录