From d9a028b87e37bf81111b3dfcae9a53acbcaf8366 Mon Sep 17 00:00:00 2001 From: DCloud_LXH <283700113@qq.com> Date: Mon, 27 May 2024 10:31:06 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E5=90=88=E5=B9=B6=20nested-scroll=20?= =?UTF-8?q?=E6=96=87=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/component/_sidebar.md | 7 ++-- docs/component/nested-scroll-body.md | 29 +------------ docs/component/nested-scroll-header.md | 28 +------------ docs/component/nested-scroll.md | 56 ++++++++++++++++++++++++++ 4 files changed, 61 insertions(+), 59 deletions(-) create mode 100644 docs/component/nested-scroll.md diff --git a/docs/component/_sidebar.md b/docs/component/_sidebar.md index ac00532e..c3f0f878 100644 --- a/docs/component/_sidebar.md +++ b/docs/component/_sidebar.md @@ -3,6 +3,7 @@ * 内置组件```{"collapsable": false}``` * [view](view.md) * [scroll-view](scroll-view.md) + * [nested-scroll](nested-scroll.md) * [list-view](list-view.md) * [sticky](sticky.md) * [swiper](swiper.md) @@ -23,7 +24,5 @@ * [video](video.md) * [web-view](web-view.md) * [animation-view](animation-view.md) - * [unicloud-db](unicloud-db.md) - * [nested-scroll-header](nested-scroll-header.md) - * [nested-scroll-body](nested-scroll-body.md) -* [其他组件](unsupport.md) \ No newline at end of file + * [unicloud-db](unicloud-db.md) +* [其他组件](unsupport.md) diff --git a/docs/component/nested-scroll-body.md b/docs/component/nested-scroll-body.md index 3bc99ffc..acdd41c4 100644 --- a/docs/component/nested-scroll-body.md +++ b/docs/component/nested-scroll-body.md @@ -1,28 +1 @@ -## nested-scroll-body - - - - - - - - - - - -### 使用场景 - -scroll-view 嵌套场景中。内层 scroll-view 滚动时无法与外层 scroll-view 滚动衔接，无法实现嵌套滚动连贯效果。因此提供`nested-scroll-body`节点，存放内层 scroll-view 节点。`nested-scroll-body`会与外层`nested-scroll-header`衔接滚动逻辑实现连贯滚动。开发者只需将内层滚动节点放置`nested-scroll-body`节点内即可。具体用法请参考[scroll-view嵌套模式](https://doc.dcloud.net.cn/uni-app-x/component/scroll-view.html#nested-scroll-view) - -**注意** - -+ `nested-scroll-body` 组件不支持css, 排版需求要交给子节点实现 -+ `nested-scroll-body` 组件不支持复数子节点，渲染时会取其第一个子节点来渲染 -+ `nested-scroll-body` 组件只能渲染在 `nested-scroll-header`组件下面 -+ 外层 scroll-view 的子节点中只能有一个 `nested-scroll-body` - - - - - - +文档已迁移，请前往[nested-scroll](./nested-scroll.md)查看最新文档 diff --git a/docs/component/nested-scroll-header.md b/docs/component/nested-scroll-header.md index 024be9e7..acdd41c4 100644 --- a/docs/component/nested-scroll-header.md +++ b/docs/component/nested-scroll-header.md @@ -1,27 +1 @@ -## nested-scroll-header - - - - - - - - - - - -### 使用场景 - -scroll-view 嵌套场景中。外层 scroll-view 滚动时无法与内层 scroll-view 滚动衔接连贯滚动，因此提供`nested-scroll-header`节点，存放除内层 scroll-view 以外的内容节点。`nested-scroll-body`内部 scroll-view 滚动时会检测`nested-scroll-header`节点滚动位置，约束内层 scroll-view 滚动逻辑，实现嵌套模式下衔接连贯滚动。开发者只需将外层要显示内容节点放置`nested-scroll-header`节点内即可。具体用法请参考[scroll-view嵌套模式](https://doc.dcloud.net.cn/uni-app-x/component/scroll-view.html#nested-scroll-view) - -**注意** - -+ `nested-scroll-header` 组件不支持css, 排版需求要交给子节点实现 -+ `nested-scroll-header` 组件不支持复数子节点，渲染时会取其第一个子节点来渲染 -+ `nested-scroll-header` 组件只能渲染在 `nested-scroll-body`组件上面 - - - - - - +文档已迁移，请前往[nested-scroll](./nested-scroll.md)查看最新文档 diff --git a/docs/component/nested-scroll.md b/docs/component/nested-scroll.md new file mode 100644 index 00000000..3556928b --- /dev/null +++ b/docs/component/nested-scroll.md @@ -0,0 +1,56 @@ +## nested-scroll-header + + + + + + + + + + + +### 使用场景 + +scroll-view 嵌套场景中。外层 scroll-view 滚动时无法与内层 scroll-view 滚动衔接连贯滚动，因此提供`nested-scroll-header`节点，存放除内层 scroll-view 以外的内容节点。`nested-scroll-body`内部 scroll-view 滚动时会检测`nested-scroll-header`节点滚动位置，约束内层 scroll-view 滚动逻辑，实现嵌套模式下衔接连贯滚动。开发者只需将外层要显示内容节点放置`nested-scroll-header`节点内即可。具体用法请参考[scroll-view嵌套模式](https://doc.dcloud.net.cn/uni-app-x/component/scroll-view.html#nested-scroll-view) + +**注意** + ++ `nested-scroll-header` 组件不支持css, 排版需求要交给子节点实现 ++ `nested-scroll-header` 组件不支持复数子节点，渲染时会取其第一个子节点来渲染 ++ `nested-scroll-header` 组件只能渲染在 `nested-scroll-body`组件上面 + + + + + + + +## nested-scroll-body + + + + + + + + + + + +### 使用场景 + +scroll-view 嵌套场景中。内层 scroll-view 滚动时无法与外层 scroll-view 滚动衔接，无法实现嵌套滚动连贯效果。因此提供`nested-scroll-body`节点，存放内层 scroll-view 节点。`nested-scroll-body`会与外层`nested-scroll-header`衔接滚动逻辑实现连贯滚动。开发者只需将内层滚动节点放置`nested-scroll-body`节点内即可。具体用法请参考[scroll-view嵌套模式](https://doc.dcloud.net.cn/uni-app-x/component/scroll-view.html#nested-scroll-view) + +**注意** + ++ `nested-scroll-body` 组件不支持css, 排版需求要交给子节点实现 ++ `nested-scroll-body` 组件不支持复数子节点，渲染时会取其第一个子节点来渲染 ++ `nested-scroll-body` 组件只能渲染在 `nested-scroll-header`组件下面 ++ 外层 scroll-view 的子节点中只能有一个 `nested-scroll-body` + + + + + + -- GitLab