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

fix: overflow responsive error

refactor-list
tangjinzhou 2021-06-21 22:56:43 +08:00
parent 3a93f198df
commit 501204c543
1 changed files with 7 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
components/vc-overflow/Overflow.tsx
View File

@ -99,7 +99,7 @@ const Overflow = defineComponent({
const mergedRestWidth = computed(() => Math.max(prevRestWidth.value, restWidth.value));
// ================================= Data =================================
const isResponsive = computed(() => props.data.length && props.maxCount === RESPONSIVE);
const isResponsive = computed(() => !!(props.data.length && props.maxCount === RESPONSIVE));
const invalidate = computed(() => props.maxCount === INVALIDATE);
/**
@ -183,7 +183,7 @@ const Overflow = defineComponent({
// ================================ Effect ================================
const getItemWidth = (index: number) => {
return itemWidths.value.get(getKey(mergedData[index], index));
return itemWidths.value.get(getKey(mergedData.value[index], index));
};
watch(
@ -215,8 +215,11 @@ const Overflow = defineComponent({
totalWidth += currentItemWidth;
if (
i === lastIndex - 1 &&
totalWidth + getItemWidth(lastIndex)! <= mergedContainerWidth.value
// Only one means `totalWidth` is the final width
(lastIndex === 0 && totalWidth <= mergedContainerWidth.value) ||
// Last two width will be the final width
(i === lastIndex - 1 &&
totalWidth + getItemWidth(lastIndex)! <= mergedContainerWidth.value)
) {
// Additional check if match the end
updateDisplayCount(lastIndex);
@ -228,11 +231,6 @@ const Overflow = defineComponent({
suffixFixedStart.value =
totalWidth - currentItemWidth - suffixWidth.value + restWidth.value;
break;
} else if (i === lastIndex) {
// Reach the end
updateDisplayCount(lastIndex);
suffixFixedStart.value = totalWidth - suffixWidth.value;
break;
}
}