optimize(hooks): extract scrollX calculation into a separate function for better readability

This commit is contained in:
Soybean
2025-10-27 18:15:26 +08:00
parent 08c8e82072
commit 93cbde737a

View File

@@ -39,11 +39,7 @@ export function useNaiveTable<ResponseData, ApiData>(options: UseNaiveTableOptio
}); });
// calculate the total width of the table this is used for horizontal scrolling // calculate the total width of the table this is used for horizontal scrolling
const scrollX = computed(() => { const scrollX = computed(() => getScrollX(result.columns.value));
return result.columns.value.reduce((acc, column) => {
return acc + Number(column.width ?? column.minWidth ?? 120);
}, 0);
});
scope.run(() => { scope.run(() => {
watch( watch(
@@ -134,6 +130,8 @@ export function useNaivePaginatedTable<ResponseData, ApiData>(
} }
}); });
const scrollX = computed(() => getScrollX(result.columns.value));
async function getDataByPage(page: number = 1) { async function getDataByPage(page: number = 1) {
if (page !== pagination.page) { if (page !== pagination.page) {
pagination.page = page; pagination.page = page;
@@ -165,6 +163,7 @@ export function useNaivePaginatedTable<ResponseData, ApiData>(
return { return {
...result, ...result,
scrollX,
getDataByPage, getDataByPage,
pagination, pagination,
mobilePagination mobilePagination
@@ -308,3 +307,9 @@ function getColumns<Column extends NaiveUI.TableColumn<any>>(cols: Column[], che
export function isTableColumnHasKey<T>(column: NaiveUI.TableColumn<T>): column is NaiveUI.TableColumnWithKey<T> { export function isTableColumnHasKey<T>(column: NaiveUI.TableColumn<T>): column is NaiveUI.TableColumnWithKey<T> {
return Boolean((column as NaiveUI.TableColumnWithKey<T>).key); return Boolean((column as NaiveUI.TableColumnWithKey<T>).key);
} }
function getScrollX<T>(columns: NaiveUI.TableColumn<T>[], minWidth: number = 120) {
return columns.reduce((acc, column) => {
return acc + Number(column.width ?? column.minWidth ?? minWidth);
}, 0);
}