mirror of
https://github.com/youzan/vant.git
synced 2025-10-22 20:04:09 +00:00
docs: prettier all markdown files
This commit is contained in:
chenjiahan
@@ -30,15 +30,15 @@ export default {
|
||||
option1: [
|
||||
{ text: 'Option1', value: 0 },
|
||||
{ text: 'Option2', value: 1 },
|
||||
{ text: 'Option3', value: 2 }
|
||||
{ text: 'Option3', value: 2 },
|
||||
],
|
||||
option2: [
|
||||
{ text: 'Option A', value: 'a' },
|
||||
{ text: 'Option B', value: 'b' },
|
||||
{ text: 'Option C', value: 'c' },
|
||||
]
|
||||
}
|
||||
}
|
||||
],
|
||||
};
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
@@ -65,15 +65,15 @@ export default {
|
||||
option: [
|
||||
{ text: 'Option1', value: 0 },
|
||||
{ text: 'Option2', value: 1 },
|
||||
{ text: 'Option3', value: 2 }
|
||||
]
|
||||
}
|
||||
{ text: 'Option3', value: 2 },
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
onConfirm() {
|
||||
this.$refs.item.toggle();
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
@@ -111,55 +111,55 @@ Use `active-color` prop to custom active color of the title and options
|
||||
### DropdownMenu Props
|
||||
|
||||
| Attribute | Description | Type | Default |
|
||||
|------|------|------|------|
|
||||
| active-color | Active color of title and option | *string* | `#1989fa` |
|
||||
| direction `v2.0.1` | Expand direction, can be set to `up` | *string* | `down` |
|
||||
| z-index | z-index of menu item | *number \| string* | `10` |
|
||||
| duration | Transition duration, unit second | *number \| string* | `0.2` |
|
||||
| overlay | Whether to show overlay | *boolean* | `true` |
|
||||
| close-on-click-overlay | Whether to close when click overlay | *boolean* | `true` |
|
||||
| close-on-click-outside `v2.0.7` | Whether to close when click outside | *boolean* | `true` |
|
||||
| --- | --- | --- | --- |
|
||||
| active-color | Active color of title and option | _string_ | `#1989fa` |
|
||||
| direction `v2.0.1` | Expand direction, can be set to `up` | _string_ | `down` |
|
||||
| z-index | z-index of menu item | _number \| string_ | `10` |
|
||||
| duration | Transition duration, unit second | _number \| string_ | `0.2` |
|
||||
| overlay | Whether to show overlay | _boolean_ | `true` |
|
||||
| close-on-click-overlay | Whether to close when click overlay | _boolean_ | `true` |
|
||||
| close-on-click-outside `v2.0.7` | Whether to close when click outside | _boolean_ | `true` |
|
||||
|
||||
### DropdownItem Props
|
||||
|
||||
| Attribute | Description | Type | Default |
|
||||
|------|------|------|------|
|
||||
| value | Value of current option，can use `v-model` | *number \| string* | - |
|
||||
| title | Item title | *string* | Text of selected option |
|
||||
| options | Options | *Option[]* | `[]` |
|
||||
| disabled | Whether to disable dropdown item | *boolean* | `false` |
|
||||
| title-class | Title class | *string* | - |
|
||||
| get-container `v2.2.4` | Return the mount node for menu | *string \| () => Element* | - |
|
||||
| --- | --- | --- | --- |
|
||||
| value | Value of current option，can use `v-model` | _number \| string_ | - |
|
||||
| title | Item title | _string_ | Text of selected option |
|
||||
| options | Options | _Option[]_ | `[]` |
|
||||
| disabled | Whether to disable dropdown item | _boolean_ | `false` |
|
||||
| title-class | Title class | _string_ | - |
|
||||
| get-container `v2.2.4` | Return the mount node for menu | _string \| () => Element_ | - |
|
||||
|
||||
### DropdownItem Events
|
||||
|
||||
| Event | Description | Arguments |
|
||||
|------|------|------|
|
||||
| change | Triggered select option and value changed | value |
|
||||
| open | Triggered when open menu | - |
|
||||
| close | Triggered when close menu | - |
|
||||
| opened | Triggered when menu opened | - |
|
||||
| closed | Triggered when menu closed | - |
|
||||
| Event | Description | Arguments |
|
||||
| ------ | ----------------------------------------- | --------- |
|
||||
| change | Triggered select option and value changed | value |
|
||||
| open | Triggered when open menu | - |
|
||||
| close | Triggered when close menu | - |
|
||||
| opened | Triggered when menu opened | - |
|
||||
| closed | Triggered when menu closed | - |
|
||||
|
||||
### DropdownItem Slots
|
||||
|
||||
| Name | Description |
|
||||
|------|------|
|
||||
| default | Content |
|
||||
| title | Custom title |
|
||||
| Name | Description |
|
||||
| ------- | ------------ |
|
||||
| default | Content |
|
||||
| title | Custom title |
|
||||
|
||||
### DropdownItem Methods
|
||||
|
||||
Use [ref](https://vuejs.org/v2/api/#ref) to get DropdownItem instance and call instance methods
|
||||
|
||||
| Name | Description | Attribute | Return value |
|
||||
|------|------|------|------|
|
||||
| toggle | Toggle display | show: boolean | - |
|
||||
| Name | Description | Attribute | Return value |
|
||||
| ------ | -------------- | ------------- | ------------ |
|
||||
| toggle | Toggle display | show: boolean | - |
|
||||
|
||||
### Data Structure of Option
|
||||
|
||||
| Key | Description | Type |
|
||||
|------|------|------|
|
||||
| text | Text | *string* |
|
||||
| value | Value | *number \| string* |
|
||||
| icon | Left icon | *string* |
|
||||
| Key | Description | Type |
|
||||
| ----- | ----------- | ------------------ |
|
||||
| text | Text | _string_ |
|
||||
| value | Value | _number \| string_ |
|
||||
| icon | Left icon | _string_ |
|
||||
|
||||
@@ -30,15 +30,15 @@ export default {
|
||||
option1: [
|
||||
{ text: '全部商品', value: 0 },
|
||||
{ text: '新款商品', value: 1 },
|
||||
{ text: '活动商品', value: 2 }
|
||||
{ text: '活动商品', value: 2 },
|
||||
],
|
||||
option2: [
|
||||
{ text: '默认排序', value: 'a' },
|
||||
{ text: '好评排序', value: 'b' },
|
||||
{ text: '销量排序', value: 'c' },
|
||||
]
|
||||
}
|
||||
}
|
||||
],
|
||||
};
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
@@ -67,15 +67,15 @@ export default {
|
||||
option: [
|
||||
{ text: '全部商品', value: 0 },
|
||||
{ text: '新款商品', value: 1 },
|
||||
{ text: '活动商品', value: 2 }
|
||||
]
|
||||
}
|
||||
{ text: '活动商品', value: 2 },
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
onConfirm() {
|
||||
this.$refs.item.toggle();
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
@@ -115,55 +115,55 @@ export default {
|
||||
### DropdownMenu Props
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
|------|------|------|------|
|
||||
| active-color | 菜单标题和选项的选中态颜色 | *string* | `#1989fa` |
|
||||
| direction `v2.0.1` | 菜单展开方向，可选值为`up` | *string* | `down` |
|
||||
| z-index | 菜单栏 z-index 层级 | *number \| string* | `10` |
|
||||
| duration | 动画时长，单位秒 | *number \| string* | `0.2` |
|
||||
| overlay | 是否显示遮罩层 | *boolean* | `true` |
|
||||
| close-on-click-overlay | 是否在点击遮罩层后关闭菜单 | *boolean* | `true` |
|
||||
| close-on-click-outside `v2.0.7` | 是否在点击外部元素后关闭菜单 | *boolean* | `true` |
|
||||
| --- | --- | --- | --- |
|
||||
| active-color | 菜单标题和选项的选中态颜色 | _string_ | `#1989fa` |
|
||||
| direction `v2.0.1` | 菜单展开方向，可选值为`up` | _string_ | `down` |
|
||||
| z-index | 菜单栏 z-index 层级 | _number \| string_ | `10` |
|
||||
| duration | 动画时长，单位秒 | _number \| string_ | `0.2` |
|
||||
| overlay | 是否显示遮罩层 | _boolean_ | `true` |
|
||||
| close-on-click-overlay | 是否在点击遮罩层后关闭菜单 | _boolean_ | `true` |
|
||||
| close-on-click-outside `v2.0.7` | 是否在点击外部元素后关闭菜单 | _boolean_ | `true` |
|
||||
|
||||
### DropdownItem Props
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
|------|------|------|------|
|
||||
| value | 当前选中项对应的 value，可以通过`v-model`双向绑定 | *number \| string* | - |
|
||||
| title | 菜单项标题 | *string* | 当前选中项文字 |
|
||||
| options | 选项数组 | *Option[]* | `[]` |
|
||||
| disabled | 是否禁用菜单 | *boolean* | `false` |
|
||||
| title-class | 标题额外类名 | *string* | - |
|
||||
| get-container `v2.2.4` | 指定挂载的节点，[用法示例](#/zh-CN/popup#zhi-ding-gua-zai-wei-zhi) | *string \| () => Element* | - |
|
||||
| --- | --- | --- | --- |
|
||||
| value | 当前选中项对应的 value，可以通过`v-model`双向绑定 | _number \| string_ | - |
|
||||
| title | 菜单项标题 | _string_ | 当前选中项文字 |
|
||||
| options | 选项数组 | _Option[]_ | `[]` |
|
||||
| disabled | 是否禁用菜单 | _boolean_ | `false` |
|
||||
| title-class | 标题额外类名 | _string_ | - |
|
||||
| get-container `v2.2.4` | 指定挂载的节点，[用法示例](#/zh-CN/popup#zhi-ding-gua-zai-wei-zhi) | _string \| () => Element_ | - |
|
||||
|
||||
### DropdownItem Events
|
||||
|
||||
| 事件名 | 说明 | 回调参数 |
|
||||
|------|------|------|
|
||||
| change | 点击选项导致 value 变化时触发 | value |
|
||||
| open | 打开菜单栏时触发 | - |
|
||||
| close | 关闭菜单栏时触发 | - |
|
||||
| opened | 打开菜单栏且动画结束后触发 | - |
|
||||
| closed | 关闭菜单栏且动画结束后触发 | - |
|
||||
| 事件名 | 说明 | 回调参数 |
|
||||
| ------ | ----------------------------- | -------- |
|
||||
| change | 点击选项导致 value 变化时触发 | value |
|
||||
| open | 打开菜单栏时触发 | - |
|
||||
| close | 关闭菜单栏时触发 | - |
|
||||
| opened | 打开菜单栏且动画结束后触发 | - |
|
||||
| closed | 关闭菜单栏且动画结束后触发 | - |
|
||||
|
||||
### DropdownItem Slots
|
||||
|
||||
| 名称 | 说明 |
|
||||
|------|------|
|
||||
| default | 菜单内容 |
|
||||
| title | 自定义标题，不支持动态渲染 |
|
||||
| 名称 | 说明 |
|
||||
| ------- | -------------------------- |
|
||||
| default | 菜单内容 |
|
||||
| title | 自定义标题，不支持动态渲染 |
|
||||
|
||||
### DropdownItem 方法
|
||||
|
||||
通过 ref 可以获取到 DropdownItem 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)
|
||||
|
||||
| 方法名 | 说明 | 参数 | 返回值 |
|
||||
|------|------|------|------|
|
||||
| --- | --- | --- | --- |
|
||||
| toggle | 切换菜单展示状态，传`true`为显示，`false`为隐藏，不传参为取反 | show?: boolean | - |
|
||||
|
||||
### Option 数据结构
|
||||
|
||||
| 键名 | 说明 | 类型 |
|
||||
|------|------|------|
|
||||
| text | 文字 | *string* |
|
||||
| value | 标识符 | *number \| string* |
|
||||
| icon | 左侧[图标名称](#/zh-CN/icon)或图片链接 | *string* |
|
||||
| 键名 | 说明 | 类型 |
|
||||
| ----- | -------------------------------------- | ------------------ |
|
||||
| text | 文字 | _string_ |
|
||||
| value | 标识符 | _number \| string_ |
|
||||
| icon | 左侧[图标名称](#/zh-CN/icon)或图片链接 | _string_ |
|
||||
|
||||
Reference in New Issue
Block a user