From 08f82392b7b1173a2b299c57b8176aed03e0063b Mon Sep 17 00:00:00 2001
From: Zhousg <zhousg1007@qq.com>
Date: Sat, 20 May 2023 21:09:34 +0800
Subject: [PATCH] =?UTF-8?q?fix(BackTop):=20When=20teleport=20is=20the=20de?=
 =?UTF-8?q?fault,=20the=20parent=20scroll=20contain=E2=80=A6=20(#11858)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* 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
---
 packages/vant/src/back-top/BackTop.tsx                     | 7 +++++--
 packages/vant/src/back-top/README.md                       | 2 +-
 packages/vant/src/back-top/README.zh-CN.md                 | 2 +-
 packages/vant/src/back-top/index.less                      | 4 ++++
 .../vant/src/back-top/test/__snapshots__/demo.spec.ts.snap | 2 ++
 5 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/packages/vant/src/back-top/BackTop.tsx b/packages/vant/src/back-top/BackTop.tsx
index 571f7473d..c9af31df6 100644
--- a/packages/vant/src/back-top/BackTop.tsx
+++ b/packages/vant/src/back-top/BackTop.tsx
@@ -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;
     };
diff --git a/packages/vant/src/back-top/README.md b/packages/vant/src/back-top/README.md
index 0d6c9ea58..7b6ab4201 100644
--- a/packages/vant/src/back-top/README.md
+++ b/packages/vant/src/back-top/README.md
@@ -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` |
diff --git a/packages/vant/src/back-top/README.zh-CN.md b/packages/vant/src/back-top/README.zh-CN.md
index 4c4a0ec59..8416b649e 100644
--- a/packages/vant/src/back-top/README.zh-CN.md
+++ b/packages/vant/src/back-top/README.zh-CN.md
@@ -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` |
diff --git a/packages/vant/src/back-top/index.less b/packages/vant/src/back-top/index.less
index 148446e14..a61ca8ce3 100644
--- a/packages/vant/src/back-top/index.less
+++ b/packages/vant/src/back-top/index.less
@@ -30,6 +30,10 @@
     opacity: var(--van-active-opacity);
   }
 
+  &__placeholder {
+    display: none;
+  }
+
   &--active {
     transform: scale(1);
   }
diff --git a/packages/vant/src/back-top/test/__snapshots__/demo.spec.ts.snap b/packages/vant/src/back-top/test/__snapshots__/demo.spec.ts.snap
index eea85b603..1c0a8af39 100644
--- a/packages/vant/src/back-top/test/__snapshots__/demo.spec.ts.snap
+++ b/packages/vant/src/back-top/test/__snapshots__/demo.spec.ts.snap
@@ -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"