使用 Vue 并且只想在列标题上有一个自定义复选框（只有一个标题，而不是所有标题）。不需要在此列上实现排序或任何疯狂行为。
我上面有 AgGrid 的主要组件非常大，所以...下面是其他代码行通常所在的位置。这只是为了表明我已导入文件并将其添加到组件中。这与我导入和调用各种cellRendererFrameworks. 在我的主要 AgGrid 组件上：
<script lang="ts">
import Vue from 'vue'
...
import AgGridSelectionHeader from '@/components/agGrid/AgGridSelectionHeader'
export default Vue.extend({
name: 'agGridInventoryView',
components: {
AgGridVue,
...
AgGridSelectionHeader,
},
props: [...],
data() {
return {
...
gridOptions: {
rowSelection: 'multiple',
rowModelType: 'serverSide',
suppressRowClickSelection: true,
cacheBlockSize: 20,
cacheOverflowSize: 20,
rowHeight: 59,
serverSideSortingAlwaysResets: true,
masterDetail: true,
rowClassRules: {},
suppressContextMenu: true,
defaultColDef: {
sortable: true,
resizable: true,
},
columnTypes: {
...
groupColumn: {
cellRenderer: 'agGroupCellRenderer',
headerComponent: AgGridSelectionHeader,
headerComponentParams: {},
checkboxSelection: true,
width: 65,
maxWidth: 65,
minWidth: 65,
menuTabs: [],
sortable: false,
resizable: false,
pinned: 'left',
lockPosition: true,
lockVisible: true,
lockPinned: true,
},
},
},
gridColumnDefs: [
{ headerName: '', field: 'type', type: 'groupColumn' },
...
我的headerComponent. 值得注意的是，即使我删除了空的生命周期方法（这样组件实际上只有templateand name），错误仍然存在。
<script lang="ts">
import Vue from 'vue'
export default Vue.extend({
name: 'agGridSelectionHeader',
components: { },
props: [],
data() {
return {
}
},
beforeMount() {
},
computed: {
},
})
</script>
<template lang="pug">
span test
</template>
错误：
