docs(@vant/use): add useScrollParent desc

This commit is contained in:
chenjiahan 2020-10-04 18:38:45 +08:00
parent d5104ec81c
commit 79493de49d
3 changed files with 54 additions and 3 deletions

View File

@ -72,7 +72,7 @@ type Options = {
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| target | 绑定事件的节点 | \_Element | Ref<Element>\_ | - |
| target | 绑定事件的元素 | \_Element | Ref<Element>\_ | - |
| listener | 点击外部时触发的回调函数 | _EventListener_ | - |
| options | 可选的配置项 | _Options_ | `{ eventName: 'click' }` |

View File

@ -18,7 +18,7 @@ export default {
console.log('window resize');
});
// 在 body 节点上绑定 click 事件
// 在 body 元素上绑定 click 事件
useEventListener(
'click',
() => {
@ -58,6 +58,6 @@ type Options = {
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| target | 绑定事件的节点 | \_EventTarget | Ref<EventTarget>\_ | `window` |
| target | 绑定事件的元素 | \_EventTarget | Ref<EventTarget>\_ | `window` |
| capture | 是否在事件捕获阶段触发 | _boolean_ | `false` |
| passive | 设置为 `true` 时,表示 `listener` 永远不会调用 `preventDefault` | _boolean_ | `false` |

View File

@ -0,0 +1,51 @@
# useScrollParent
获取元素最近的可滚动父元素。
## 代码演示
### 基本用法
```html
<div ref="root" />
```
```js
import { watch } from 'vue';
import { useScrollParent, useEventListener } from '@vant/use';
export default {
setup() {
const root = ref();
const scrollParent = useScrollParent(root);
useEventListener(
'scroll',
() => {
console.log('scroll');
},
{ target: scrollParent }
);
return { root };
},
};
```
## 类型定义
```ts
function useScrollParent(element: Ref<Element>): Ref<Element>;
```
## 参数
| 参数 | 说明 | 类型 | 默认值 |
| ------- | -------- | -------------- | ------ |
| element | 当前元素 | _Ref<Element>_ | - |
## 返回值
| 参数 | 说明 | 类型 | 默认值 |
| ------------ | ------------------ | -------------- | ------ |
| scrollParent | 最近的可滚动父元素 | _Ref<Element>_ | - |