mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-05-21 22:09:16 +08:00
docs(@vant/use): add useToggle doc
This commit is contained in:
parent
0b05fa00aa
commit
90669560a4
@ -12,10 +12,15 @@ module.exports = {
|
||||
],
|
||||
sidebarDepth: 0,
|
||||
sidebar: [
|
||||
{
|
||||
title: '介绍',
|
||||
collapsable: false,
|
||||
children: ['/'],
|
||||
},
|
||||
{
|
||||
title: 'State',
|
||||
collapsable: false,
|
||||
// children: ['/src/useToggle/'],
|
||||
children: ['/src/useToggle/'],
|
||||
},
|
||||
{
|
||||
title: 'DOM',
|
||||
|
@ -33,6 +33,6 @@ type VisibilityState = 'visible' | 'hidden';
|
||||
|
||||
### 返回值
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| visibilityState | 页面当前的可见状态,`visible` 为可见,`hidden` 为隐藏 | _Ref\<VisibilityState>_ | - |
|
||||
| 参数 | 说明 | 类型 |
|
||||
| --- | --- | --- |
|
||||
| visibilityState | 页面当前的可见状态,`visible` 为可见,`hidden` 为隐藏 | _Ref\<VisibilityState>_ |
|
||||
|
@ -48,6 +48,6 @@ function useScrollParent(element: Ref<Element>): Ref<Element>;
|
||||
|
||||
### 返回值
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| ------------ | ------------------ | --------------- | ------ |
|
||||
| scrollParent | 最近的可滚动父元素 | _Ref\<Element>_ | - |
|
||||
| 参数 | 说明 | 类型 |
|
||||
| ------------ | ------------------ | --------------- |
|
||||
| scrollParent | 最近的可滚动父元素 | _Ref\<Element>_ |
|
||||
|
62
packages/vant-use/src/useToggle/README.md
Normal file
62
packages/vant-use/src/useToggle/README.md
Normal file
@ -0,0 +1,62 @@
|
||||
# useToggle
|
||||
|
||||
用于在 `true` 和 `false` 之间进行切换。
|
||||
|
||||
## 代码演示
|
||||
|
||||
### 基本用法
|
||||
|
||||
```js
|
||||
import { useToggle } from '@vant/use';
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
const [state, toggle] = useToggle();
|
||||
|
||||
toggle(true);
|
||||
console.log(state.value); // -> true
|
||||
|
||||
toggle(false);
|
||||
console.log(state.value); // -> false
|
||||
|
||||
toggle();
|
||||
console.log(state.value); // -> true
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
### 设置默认值
|
||||
|
||||
```js
|
||||
import { useToggle } from '@vant/use';
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
const [state, toggle] = useToggle(true);
|
||||
console.log(state.value); // -> true
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
### 类型定义
|
||||
|
||||
```ts
|
||||
function useToggle(
|
||||
defaultValue: boolean
|
||||
): [Ref<boolean>, (newValue: boolean) => void];
|
||||
```
|
||||
|
||||
### 参数
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| ------------ | ------ | --------- | ------- |
|
||||
| defaultValue | 默认值 | _boolean_ | `false` |
|
||||
|
||||
### 返回值
|
||||
|
||||
| 参数 | 说明 | 类型 |
|
||||
| ------ | ---------------- | ------------------------------ |
|
||||
| state | 状态值 | _Ref\<boolean>_ |
|
||||
| toggle | 切换状态值的函数 | _(newValue?: boolean) => void_ |
|
Loading…
x
Reference in New Issue
Block a user