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,
|
sidebarDepth: 0,
|
||||||
sidebar: [
|
sidebar: [
|
||||||
|
{
|
||||||
|
title: '介绍',
|
||||||
|
collapsable: false,
|
||||||
|
children: ['/'],
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: 'State',
|
title: 'State',
|
||||||
collapsable: false,
|
collapsable: false,
|
||||||
// children: ['/src/useToggle/'],
|
children: ['/src/useToggle/'],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'DOM',
|
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