blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-05 19:41:42 +08:00
Code Issues Projects Releases Wiki Activity

fix(BackTop): When teleport is the default, the parent scroll contain… (#11858)

Browse Source 
* fix(BackTop): When teleport is the default, the parent scroll container is always window

* fix(BackTop): When teleport is the default, the parent scroll container is always window
This commit is contained in:
Zhousg 2023-05-20 21:09:34 +08:00 committed by GitHub
parent b94c8c3333
commit 08f82392b7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 13 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
packages/vant/src/back-top/BackTop.tsx
View File

@ -121,7 +121,7 @@ export default defineComponent({
return () => {
const Content = (
<div
ref={root}
ref={!props.teleport ? root : undefined}
class={bem({ active: show.value })}
style={style.value}
onClick={onClick}
@ -136,7 +136,10 @@ export default defineComponent({
);
if (props.teleport) {
return <Teleport to={props.teleport}>{Content}</Teleport>;
return [
<div ref={root} class={bem('placeholder')}></div>,
<Teleport to={props.teleport}>{Content}</Teleport>,
];
}
return Content;
};

2
packages/vant/src/back-top/README.md
View File

@ -120,7 +120,7 @@ Add `immediate` prop to scroll to top immediately.
| Attribute | Description | Type | Default |
| --- | --- | --- | --- |
| target | Can be a selector or a DOM ELement | _string \| HTMLElement_ | - |
| target | Can be a selector or a DOM ELement, default closest parent scrolling container | _string \| HTMLElement_ | - |
| right | Right distance of the page, the default unit is px | _number \| string_ | `30` |
| bottom | Bottom distance of the page, the default unit is px | _number \| string_ | `40` |
| offset | The component will not display until the scroll offset reaches this value | _number_ | `200` |

2
packages/vant/src/back-top/README.zh-CN.md
View File

@ -122,7 +122,7 @@ export default {
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| target | 触发滚动的目标对象，支持传入选择器或 DOM 元素 | _string \| HTMLElement_ | - |
| target | 触发滚动的目标对象，支持传入选择器或 DOM 元素，默认最近的父级滚动容器 | _string \| HTMLElement_ | - |
| right | 距离页面右侧的距离，默认单位为 `px` | _number \| string_ | `30` |
| bottom | 距离页面底部的距离，默认单位为 `px` | _number \| string_ | `40` |
| offset | 滚动高度达到此参数值时才显示组件 | _number_ | `200` |

4
packages/vant/src/back-top/index.less
View File

@ -30,6 +30,10 @@
opacity: var(--van-active-opacity);
}
&__placeholder {
display: none;
}
&--active {
transform: scale(1);
}

2
packages/vant/src/back-top/test/__snapshots__/demo.spec.ts.snap
View File

@ -426,6 +426,8 @@ exports[`should render demo and match snapshot 1`] = `
</span>
</div>
</div>
<div class="van-back-top__placeholder">
</div>
</div>
<div id="van-tab"
role="tabpanel"