Skip to content
This repository was archived by the owner on Mar 27, 2025. It is now read-only.

Commit bfed14c

Browse files
committed
feat(BTable): corrected item rendering logic, allowing easier updates to the renderItem function which can now include more logic for rendering beside formatting
1 parent 4f177dd commit bfed14c

File tree

2 files changed

+18
-7
lines changed

2 files changed

+18
-7
lines changed

packages/bootstrap-vue-next/src/components/BTable/BTable.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@
117117
:toggle-details="() => toggleRowDetails(item)"
118118
:details-showing="item._showDetails"
119119
/>
120-
<template v-else>{{ itemHelper.formatItem(item, field) }}</template>
120+
<template v-else>{{ itemHelper.renderItem(item, field) }}</template>
121121
</td>
122122
</tr>
123123

packages/bootstrap-vue-next/src/components/BTable/itemHelper.ts

Lines changed: 17 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import {ref, type Ref} from 'vue'
22
import type {BTableSortCompare, TableField, TableFieldObject, TableItem} from '../../types'
33
import {isObject, startCase} from '../../utils'
44
import {cloneDeep, cloneDeepAsync} from '../../utils/object'
5+
import type {TableFieldObjectFormatter} from 'src/types/TableFieldObject'
56

67
export default () => {
78
const normaliseFields = (origFields: TableField[], items: TableItem[]): TableFieldObject[] => {
@@ -124,12 +125,22 @@ export default () => {
124125
}
125126
}
126127

127-
const formatItem = (item: TableItem, fields: TableFieldObject) => {
128-
const value = item[fields.key]
129-
if (fields.formatter && typeof fields.formatter === 'function') {
130-
return fields.formatter(value, fields.key, item)
128+
const formatItem = (
129+
item: TableItem,
130+
fieldKey: string,
131+
formatter?: TableFieldObjectFormatter<typeof item>
132+
) => {
133+
const val = item[fieldKey]
134+
if (formatter && typeof formatter === 'function') {
135+
return formatter(val, fieldKey, item)
131136
}
132-
return item[fields.key]
137+
return val
138+
}
139+
140+
const renderItem = (item: TableItem, fields: TableFieldObject) => {
141+
const formattedValue = formatItem(item, fields.key, fields.formatter)
142+
143+
return formattedValue
133144
}
134145

135146
return {
@@ -139,6 +150,6 @@ export default () => {
139150
updateInternalItems,
140151
filterEvent,
141152
notifyFilteredItems,
142-
formatItem,
153+
renderItem,
143154
}
144155
}

0 commit comments

Comments
 (0)