Skip to content

Commit fb9201c

Browse files
fix: resolve TypeScript type error for expanded state
1 parent 719eb77 commit fb9201c

File tree

1 file changed

+5
-4
lines changed

1 file changed

+5
-4
lines changed

examples/vue/grouping/src/App.vue

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@ import {
66
getGroupedRowModel,
77
useVueTable,
88
type ColumnDef,
9-
type GroupingState,
109
type ExpandedState,
10+
type GroupingState,
1111
} from '@tanstack/vue-table'
1212
import { ref } from 'vue'
1313
@@ -133,9 +133,10 @@ const table = useVueTable({
133133
134134
// Toggle row expanded state
135135
const toggleRowExpanded = (id: string): void => {
136+
const currentExpanded = expanded.value as Record<string, boolean>
136137
expanded.value = {
137-
...expanded.value,
138-
[id]: !expanded.value[id],
138+
...currentExpanded,
139+
[id]: !currentExpanded[id],
139140
}
140141
}
141142
@@ -212,7 +213,7 @@ const clearGrouping = (): void => {
212213
class="expand-button"
213214
@click="toggleRowExpanded(row.id)"
214215
>
215-
<span v-if="expanded[row.id]" class="icon">👇</span>
216+
<span v-if="row.getIsExpanded()" class="icon">👇</span>
216217
<span v-else class="icon">👉</span>
217218
<span class="group-value">{{ cell.getValue() }}</span>
218219
<span class="group-count"> ({{ row.subRows.length }}) </span>

0 commit comments

Comments
 (0)