Skip to content

Commit

Permalink
fix(docs): refactor for en-US docs
Browse files Browse the repository at this point in the history
  • Loading branch information
@fu050409
fu050409 committed Jul 6, 2024
1 parent d2bfddd commit 984ef80
Show file tree
Hide file tree
Showing 16 changed files with 604 additions and 543 deletions.
4 changes: 3 additions & 1 deletion packages/devui-vue/docs/components/button/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,9 @@

### 禁用状态

:::demo 通过`disabled`参数设置按钮禁用状态。
通过`disabled`参数设置按钮禁用状态。

:::demo

```vue
<template>
Expand Down
62 changes: 38 additions & 24 deletions packages/devui-vue/docs/components/cascader/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,13 @@

下拉级联菜单。

#### 何时使用
:::tip 何时使用

1. 需要从一组相关联的数据集合进行选择，例如省市区，公司层级，事物分类等。
2. 从一个较大的数据集合中进行选择时，用多级分类进行分隔，方便选择。

:::

### 基本用法

:::demo
Expand All @@ -16,7 +18,15 @@
<div class="mb-0">hover mode</div>
<d-cascader class="mb-2" :options="options" placeholder="请选择" style="width: 200px"></d-cascader>
<div class="mb-0">click mode</div>
<d-cascader class="mb-2" :options="options" v-model="value" showPath trigger="click" placeholder="请选择" style="width: 200px"></d-cascader>
<d-cascader
class="mb-2"
:options="options"
v-model="value"
showPath
trigger="click"
placeholder="请选择"
style="width: 200px"
></d-cascader>
<div class="mb-0">data empty</div>
<d-cascader class="mb-2" :options="[]" trigger="click" placeholder="请选择" style="width: 200px"></d-cascader>
<div class="mb-0">disabled</div>
Expand Down Expand Up @@ -125,21 +135,23 @@ export default defineComponent({

### 尺寸

:::demo 支持`sm`、`md`、`lg`三种尺寸，默认为`md`。
支持`sm`、`md`、`lg`三种尺寸，默认为`md`。

:::demo

```vue
<template>
<h4>Small</h4>
<d-cascader :options="options" size="sm" placeholder="请选择" style="width: 200px"></d-cascader>
<d-cascader :options="options" size="sm" placeholder="请选择" style="width: 200px"></d-cascader>
<h4>Middle</h4>
<d-cascader :options="options" size="md" placeholder="请选择" style="width: 200px"></d-cascader>
<d-cascader :options="options" size="md" placeholder="请选择" style="width: 200px"></d-cascader>
<h4>Large</h4>
<d-cascader :options="options" size="lg" placeholder="请选择" style="width: 200px"></d-cascader>
<d-cascader :options="options" size="lg" placeholder="请选择" style="width: 200px"></d-cascader>
</template>
<script>
import { defineComponent, reactive, ref } from 'vue';
Expand Down Expand Up @@ -244,7 +256,9 @@ export default defineComponent({

### 自定义宿主元素

:::demo 可通过`host`插槽自定义展开`Cascader`菜单的宿主元素。
可通过`host`插槽自定义展开`Cascader`菜单的宿主元素。

:::demo

```vue
<template>
Expand Down Expand Up @@ -494,20 +508,20 @@ export default defineComponent({

### API

| 参数 | 类型 | 默认 | 说明 | 跳转 Demo |
| :------------ | :-------------------------------- | :------ | :--------------------------------------------------------------------------------------------------- |--------------------------------------|
| v-model | `(number\|string)[]` | [] | 可选，单选时为`(number\ |sring)[]` | [基本用法](#基本用法) |
| trigger | `'hover'\|'click'` | 'hover' | 可选，指定展开次级菜单的方式 | [基本用法](#基本用法) |
| options | [`CascaderItem[]`](#CascaderItem) | [] | 必选，级联器的菜单信息 | [基本用法](#基本用法) |
| placeholder | `string` | '' | 可选，没有选择时的输入框展示信息 | [基本用法](#基本用法) |
| disabled | `boolean` | false | 可选，级联器是否禁用 | [基本用法](#基本用法) |
| width | `number \| string` | 200 | 可选，单位 px，用于控制组件输入框宽度和下拉的宽度 | [基本用法](#多选模式) |
| dropdownWidth | `number \| string` | 200 | 可选，单位 px，控制下拉列表的宽度，默认和组件输入框 width 相等 | [基本用法](#多选模式) |
| clearable | `boolean` | true | 可选，是否支持清空选项 | [基本用法](#基本用法) |
| filterable | `boolean` | true | 可选，是否可搜索选项 | [可搜索](#可搜索) |
| debounce | `number` | 300 | 可选，搜索关键词输入去抖延迟 | [可搜索](#可搜索) |
| before-filter | `function(value)` | -- | 可选,过滤函数调用前的钩子函数。该函数返回值时 false 或者被拒绝的 Promise，接下来的过滤逻辑将不会执行 | [可搜索](#可搜索) |
| size | [CascaderSize](#cascadersize) | 'md' | 文本框的尺寸 | [尺寸](#尺寸) |
| 参数 | 类型 | 默认 | 说明 | 跳转 Demo |
| :------------ | :-------------------------------- | :------ | :--------------------------------------------------------------------------------------------------- | --------------------- | --------------------- |
| v-model | `(number\|string)[]` | [] | 可选，单选时为`(number\ | sring)[]` | [基本用法](#基本用法) |
| trigger | `'hover'\|'click'` | 'hover' | 可选，指定展开次级菜单的方式 | [基本用法](#基本用法) |
| options | [`CascaderItem[]`](#CascaderItem) | [] | 必选，级联器的菜单信息 | [基本用法](#基本用法) |
| placeholder | `string` | '' | 可选，没有选择时的输入框展示信息 | [基本用法](#基本用法) |
| disabled | `boolean` | false | 可选，级联器是否禁用 | [基本用法](#基本用法) |
| width | `number \| string` | 200 | 可选，单位 px，用于控制组件输入框宽度和下拉的宽度 | [基本用法](#多选模式) |
| dropdownWidth | `number \| string` | 200 | 可选，单位 px，控制下拉列表的宽度，默认和组件输入框 width 相等 | [基本用法](#多选模式) |
| clearable | `boolean` | true | 可选，是否支持清空选项 | [基本用法](#基本用法) |
| filterable | `boolean` | true | 可选，是否可搜索选项 | [可搜索](#可搜索) |
| debounce | `number` | 300 | 可选，搜索关键词输入去抖延迟 | [可搜索](#可搜索) |
| before-filter | `function(value)` | -- | 可选,过滤函数调用前的钩子函数。该函数返回值时 false 或者被拒绝的 Promise，接下来的过滤逻辑将不会执行 | [可搜索](#可搜索) |
| size | [CascaderSize](#cascadersize) | 'md' | 文本框的尺寸 | [尺寸](#尺寸) |

### Cascader 事件

Expand Down
Loading

0 comments on commit 984ef80

Please sign in to comment.