github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: select scroll height not correct #3419

pull/3433/head
tanjinzhou 2020-12-22 13:22:14 +08:00
parent 4f9555c64a
commit aea25100e5
3 changed files with 6 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
antdv-demo

@ -1 +1 @@
Subproject commit db458a2276cd9156a7824f4e876de5702efd9ff7 Subproject commit 8269bbdf109ab684626cd8ef0c4fc5f0c2222210

3
components/vc-virtual-list/List.tsx
View File

@ -133,7 +133,7 @@ const List = defineComponent({
} }
// ================================ Height ================================ // ================================ Height ================================
const [setInstance, collectHeight, heights, heightUpdatedMark] = useHeights(getKey, null, null); const [setInstance, collectHeight, heights] = useHeights(getKey, null, null);
// ========================== Visible Calculation ========================= // ========================== Visible Calculation =========================
const calRes = computed(() => { const calRes = computed(() => {
if (!useVirtual.value) { if (!useVirtual.value) {
@ -194,7 +194,6 @@ const List = defineComponent({
// Give cache to improve scroll experience // Give cache to improve scroll experience
endIndex = Math.min(endIndex + 1, state.mergedData.length); endIndex = Math.min(endIndex + 1, state.mergedData.length);
return { return {
heightUpdatedMark,
scrollHeight: itemTop, scrollHeight: itemTop,
start: startIndex, start: startIndex,
end: endIndex, end: endIndex,

10
components/vc-virtual-list/hooks/useHeights.tsx
View File

@ -1,4 +1,4 @@
import { Ref, ref, VNodeProps } from 'vue'; import { reactive, VNodeProps } from 'vue';
import { GetKey } from '../interface'; import { GetKey } from '../interface';
type CacheMap = Record<string, number>; type CacheMap = Record<string, number>;
@ -7,10 +7,9 @@ export default function useHeights<T>(
getKey: GetKey<T>, getKey: GetKey<T>,
onItemAdd?: ((item: T) => void) | null, onItemAdd?: ((item: T) => void) | null,
onItemRemove?: ((item: T) => void) | null, onItemRemove?: ((item: T) => void) | null,
): [(item: T, instance: HTMLElement) => void, () => void, CacheMap, Ref<number>] { ): [(item: T, instance: HTMLElement) => void, () => void, CacheMap] {
const instance = new Map<VNodeProps['key'], HTMLElement>(); const instance = new Map<VNodeProps['key'], HTMLElement>();
const heights = {}; const heights = reactive({});
const updatedMark = ref(0);
let heightUpdateId = 0; let heightUpdateId = 0;
function collectHeight() { function collectHeight() {
heightUpdateId += 1; heightUpdateId += 1;
@ -28,7 +27,6 @@ export default function useHeights<T>(
} }
} }
}); });
updatedMark.value++;
}); });
} }
@ -53,5 +51,5 @@ export default function useHeights<T>(
} }
} }
return [setInstance, collectHeight, heights, updatedMark]; return [setInstance, collectHeight, heights];
} }