JLNTV_IPD/tmagic-editor
4
0
Fork 0
mirror of https://github.com/Tencent/tmagic-editor.git synced 2025-04-06 03:57:56 +08:00
Code Issues Projects Releases Wiki Activity

fix(form): select下拉列表分页不生效问题

Browse Source
This commit is contained in:
roymondchen 2023-02-21 15:40:29 +08:00
parent fcb69b7743
commit 8edf023a00
1 changed files with 29 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
packages/form/src/fields/Select.vue
View File

@ -26,7 +26,7 @@
</template>
<script lang="ts" setup name="MFormSelect">
import { inject, nextTick, onBeforeMount, onMounted, Ref, ref, watchEffect } from 'vue';
import { inject, onBeforeMount, Ref, ref, watch, watchEffect } from 'vue';
import { TMagicSelect } from '@tmagic/design';
@ -331,26 +331,36 @@ if (typeof props.config.options === 'function') {
});
}
props.config.remote &&
onMounted(async () => {
await nextTick();
tMagicSelect.value?.scrollbarWrap?.addEventListener('scroll', async (e: Event) => {
const el = e.currentTarget as HTMLDivElement;
if (moreLoadingVisible.value) {
if (props.config.remote) {
const unWacth = watch(
() => tMagicSelect.value?.scrollbarWrap,
(scrollbarWrap) => {
if (!scrollbarWrap) {
return;
}
if (el.scrollHeight - el.clientHeight - el.scrollTop > 1) {
return;
}
if (total.value <= options.value.length) {
return;
}
moreLoadingVisible.value = true;
pgIndex.value += 1;
options.value = await getOptions();
moreLoadingVisible.value = false;
});
});
scrollbarWrap.addEventListener('scroll', async (e: Event) => {
const el = e.currentTarget as HTMLDivElement;
if (moreLoadingVisible.value) {
return;
}
if (el.scrollHeight - el.clientHeight - el.scrollTop > 1) {
return;
}
if (total.value <= options.value.length) {
return;
}
moreLoadingVisible.value = true;
pgIndex.value += 1;
options.value = await getOptions();
moreLoadingVisible.value = false;
});
unWacth();
},
{
immediate: true,
},
);
}
const popperClass = mForm?.popperClass;