blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

feat(List): add scroller prop (#12154)

Browse Source
This commit is contained in:
neverland 2023-08-06 10:44:50 +08:00 committed by GitHub
parent d988df7ba5
commit 6a56908438
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 8 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/vant/src/list/List.tsx
View File

@ -1,10 +1,12 @@
import { import {
ref, ref,
watch, watch,
computed,
nextTick, nextTick,
onUpdated, onUpdated,
onMounted, onMounted,
defineComponent, defineComponent,
type PropType,
type ExtractPropTypes, type ExtractPropTypes,
} from 'vue'; } from 'vue';
@ -36,6 +38,7 @@ export const listProps = {
loading: Boolean, loading: Boolean,
disabled: Boolean, disabled: Boolean,
finished: Boolean, finished: Boolean,
scroller: Object as PropType<Element>,
errorText: String, errorText: String,
direction: makeStringProp<ListDirection>('down'), direction: makeStringProp<ListDirection>('down'),
loadingText: String, loadingText: String,
@ -59,6 +62,7 @@ export default defineComponent({
const placeholder = ref<HTMLElement>(); const placeholder = ref<HTMLElement>();
const tabStatus = useTabStatus(); const tabStatus = useTabStatus();
const scrollParent = useScrollParent(root); const scrollParent = useScrollParent(root);
const scroller = computed(() => props.scroller || scrollParent.value);
const check = () => { const check = () => {
nextTick(() => { nextTick(() => {
@ -75,7 +79,7 @@ export default defineComponent({
const { direction } = props; const { direction } = props;
const offset = +props.offset; const offset = +props.offset;
const scrollParentRect = useRect(scrollParent); const scrollParentRect = useRect(scroller);
if (!scrollParentRect.height || isHidden(root)) { if (!scrollParentRect.height || isHidden(root)) {
return; return;
@ -170,7 +174,7 @@ export default defineComponent({
useExpose<ListExpose>({ check }); useExpose<ListExpose>({ check });
useEventListener('scroll', check, { useEventListener('scroll', check, {
target: scrollParent, target: scroller,
passive: true, passive: true,
}); });

1
packages/vant/src/list/README.md
View File

@ -177,6 +177,7 @@ export default {
| immediate-check | Whether to check loading position immediately after mounted | _boolean_ | `true` | | immediate-check | Whether to check loading position immediately after mounted | _boolean_ | `true` |
| disabled | Whether to disable the load event | _boolean_ | `false` | | disabled | Whether to disable the load event | _boolean_ | `false` |
| direction | Scroll direction, can be set to `up` | _string_ | `down` | | direction | Scroll direction, can be set to `up` | _string_ | `down` |
| scroller `v4.6.4` | Specifies the node that needs to listen for scroll events, defaults to the nearest parent scroll node | _Element_ | - |
### Events ### Events

1
packages/vant/src/list/README.zh-CN.md
View File

@ -192,6 +192,7 @@ export default {
| immediate-check | 是否在初始化时立即执行滚动位置检查 | _boolean_ | `true` | | immediate-check | 是否在初始化时立即执行滚动位置检查 | _boolean_ | `true` |
| disabled | 是否禁用滚动加载 | _boolean_ | `false` | | disabled | 是否禁用滚动加载 | _boolean_ | `false` |
| direction | 滚动触发加载的方向，可选值为 `up` | _string_ | `down` | | direction | 滚动触发加载的方向，可选值为 `up` | _string_ | `down` |
| scroller `v4.6.4` | 指定需要监听滚动事件的节点，默认为最近的父级滚动节点 | _Element_ | - |
### Events ### Events