fix(grid): stabilize single-column scrolling
This commit is contained in:
parent
7fb53ee0b4
commit
fbe64de315
|
|
@ -1573,6 +1573,7 @@ const { initColumnWidths, onResizeStart, autoFitColumn, renderedColumnWidths, to
|
|||
sourceRows: computed(() => props.result.rows),
|
||||
columnIndexes: visibleColumnIndexes,
|
||||
gridRef,
|
||||
scrollbarGutter: gridScrollbarGutter,
|
||||
});
|
||||
const gridStyle = computed(() => ({
|
||||
...columnVars.value,
|
||||
|
|
@ -7763,6 +7764,7 @@ const gridContextMenuItems = computed<ContextMenuItem[]>(() => {
|
|||
|
||||
.data-grid-scroller {
|
||||
overflow-anchor: none;
|
||||
scrollbar-gutter: stable;
|
||||
will-change: scroll-position;
|
||||
contain: strict;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,10 +15,11 @@ export interface UseDataGridColumnResizeOptions {
|
|||
sourceRows: ComputedRef<CellValue[][]>;
|
||||
columnIndexes: ComputedRef<number[]>;
|
||||
gridRef: Ref<HTMLDivElement | undefined>;
|
||||
scrollbarGutter?: Ref<number>;
|
||||
}
|
||||
|
||||
export function useDataGridColumnResize(options: UseDataGridColumnResizeOptions) {
|
||||
const { columns, sourceRows, columnIndexes, gridRef } = options;
|
||||
const { columns, sourceRows, columnIndexes, gridRef, scrollbarGutter } = options;
|
||||
|
||||
const columnWidths = ref<number[]>([]);
|
||||
const { width: gridWidth } = useElementSize(gridRef);
|
||||
|
|
@ -80,7 +81,8 @@ export function useDataGridColumnResize(options: UseDataGridColumnResizeOptions)
|
|||
const widths = columnWidths.value;
|
||||
if (widths.length === 0) return widths;
|
||||
|
||||
const extraWidth = Math.max(0, gridWidth.value - DATA_GRID_ROW_NUM_WIDTH - baseTotalWidth.value);
|
||||
const availableWidth = Math.max(0, gridWidth.value - (scrollbarGutter?.value ?? 0));
|
||||
const extraWidth = Math.max(0, availableWidth - DATA_GRID_ROW_NUM_WIDTH - baseTotalWidth.value);
|
||||
if (extraWidth === 0) return widths;
|
||||
|
||||
const extraPerColumn = extraWidth / widths.length;
|
||||
|
|
|
|||
Loading…
Reference in New Issue