vue3中使用 ag-grid 表格组件
安装:
cnpm install ag-grid-vue3 ag-grid-community vue-class-component@next
使用:
// //引入样式文件 // import 'ag-grid-enterprise'; import "ag-grid-community/dist/styles/ag-grid.css"; import "ag-grid-community/dist/styles/ag-theme-alpine.css"; import "ag-grid-community/dist/styles/ag-theme-balham.css" // //引入ag-grid-vue import { AgGridVue } from "ag-grid-vue3";
components: {
AgGridVue
},
HTML:
<ag-grid-vue style="width: 100%; height: 200px;" class="table ag-theme-balham" :columnDefs="columnDefs" :rowData="rowData" :enableColResize="false" @gridReady="onGridReady" rowSelection="multiple" rowHeight='50' :enableSorting="true" :sideBar="sideBar" :pagination="true" :paginationPageSize="10" ></ag-grid-vue>