mirror of
https://github.com/element-plus/element-plus.git
synced 2026-03-13 07:51:17 +08:00
docs(docs): fix space docs error (#1044)
* docs(docs): fix space docs error fix #1040 * fix: update
This commit is contained in:
@@ -1,4 +1,4 @@
|
||||
## Space
|
||||
## Space
|
||||
Even though we have [Divider](#/en-US/component/divider), but sometimes we need more than one [Divider](#/en-US/component/divider) to split the elements apart, so we stack each elements upon [Divider](#/en-US/component/divider), but doing so not only makes our code ugly but also makes it difficult to maintain. **Space** is this kind of component provides us both productivity and elegance.
|
||||
|
||||
### Basic usage
|
||||
@@ -57,7 +57,7 @@ Using `direction` attribute to control the layout, we use `flex-direction` to im
|
||||
### Control the size of the space
|
||||
Control the space size via `size` API.
|
||||
|
||||
You can set the size with built-in sizes `mini`, `small`, `medium`, `large`, these size coresponds to `8px`, `12px`, `16px`, `20px`. The default size is `small`, A.K.A. `12px`
|
||||
You can set the size with built-in sizes `mini`, `small`, `medium`, `large`, these size coresponds to `4px`, `8px`, `12px`, `16px`. The default size is `small`, A.K.A. `8px`
|
||||
|
||||
You can also using customized size to override it. Refer to the next part.
|
||||
|
||||
@@ -286,10 +286,10 @@ Setting this attribute can adjust the alignment of child nodes, the desirable va
|
||||
| direction | Placement direction | string | vertical/horizontal | horizontal |
|
||||
| prefixCls | Prefix for space-items | string | el-space | - |
|
||||
| style | Extra style rules | string / Array<Object \| String> / Object | - | - |
|
||||
| spacer | Spacer | string / number / VNode | - | - |
|
||||
| spacer | Spacer | string / number / VNode | - | - |
|
||||
| size | Spacing size | string / number / [number, number] | - | 'small' |
|
||||
| wrap | Auto wrapping | boolean | true / false | false |
|
||||
### Space Slot
|
||||
| name | description |
|
||||
|----|----|
|
||||
| default | Items to be spaced |
|
||||
| default | Items to be spaced |
|
||||
|
||||
@@ -57,7 +57,7 @@ Using `direction` attribute to control the layout, we use `flex-direction` to im
|
||||
### Control the size of the space
|
||||
Control the space size via `size` API.
|
||||
|
||||
You can set the size with built-in sizes `mini`, `small`, `medium`, `large`, these size coresponds to `8px`, `12px`, `16px`, `20px`. The default size is `small`, A.K.A. `12px`
|
||||
You can set the size with built-in sizes `mini`, `small`, `medium`, `large`, these size coresponds to `4px`, `8px`, `12px`, `16px`. The default size is `small`, A.K.A. `8px`
|
||||
|
||||
You can also using customized size to override it. Refer to the next part.
|
||||
|
||||
@@ -286,10 +286,10 @@ Setting this attribute can adjust the alignment of child nodes, the desirable va
|
||||
| direction | Placement direction | string | vertical/horizontal | horizontal |
|
||||
| prefixCls | Prefix for space-items | string | el-space | - |
|
||||
| style | Extra style rules | string / Array<Object \| String> / Object | - | - |
|
||||
| spacer | Spacer | string / number / VNode | - | - |
|
||||
| spacer | Spacer | string / number / VNode | - | - |
|
||||
| size | Spacing size | string / number / [number, number] | - | 'small' |
|
||||
| wrap | Auto wrapping | boolean | true / false | false |
|
||||
### Space Slot
|
||||
| name | description |
|
||||
|----|----|
|
||||
| default | Items to be spaced |
|
||||
| default | Items to be spaced |
|
||||
|
||||
@@ -57,7 +57,7 @@ Using `direction` attribute to control the layout, we use `flex-direction` to im
|
||||
### Control the size of the space
|
||||
Control the space size via `size` API.
|
||||
|
||||
You can set the size with built-in sizes `mini`, `small`, `medium`, `large`, these size coresponds to `8px`, `12px`, `16px`, `20px`. The default size is `small`, A.K.A. `12px`
|
||||
You can set the size with built-in sizes `mini`, `small`, `medium`, `large`, these size coresponds to `4px`, `8px`, `12px`, `16px`. The default size is `small`, A.K.A. `8px`
|
||||
|
||||
You can also using customized size to override it. Refer to the next part.
|
||||
|
||||
@@ -286,10 +286,10 @@ Setting this attribute can adjust the alignment of child nodes, the desirable va
|
||||
| direction | Placement direction | string | vertical/horizontal | horizontal |
|
||||
| prefixCls | Prefix for space-items | string | el-space | - |
|
||||
| style | Extra style rules | string / Array<Object \| String> / Object | - | - |
|
||||
| spacer | Spacer | string / number / VNode | - | - |
|
||||
| spacer | Spacer | string / number / VNode | - | - |
|
||||
| size | Spacing size | string / number / [number, number] | - | 'small' |
|
||||
| wrap | Auto wrapping | boolean | true / false | false |
|
||||
### Space Slot
|
||||
| name | description |
|
||||
|----|----|
|
||||
| default | Items to be spaced |
|
||||
| default | Items to be spaced |
|
||||
|
||||
@@ -57,7 +57,7 @@ Using `direction` attribute to control the layout, we use `flex-direction` to im
|
||||
### Control the size of the space
|
||||
Control the space size via `size` API.
|
||||
|
||||
You can set the size with built-in sizes `mini`, `small`, `medium`, `large`, these size coresponds to `8px`, `12px`, `16px`, `20px`. The default size is `small`, A.K.A. `12px`
|
||||
You can set the size with built-in sizes `mini`, `small`, `medium`, `large`, these size coresponds to `4px`, `8px`, `12px`, `16px`. The default size is `small`, A.K.A. `8px`
|
||||
|
||||
You can also using customized size to override it. Refer to the next part.
|
||||
|
||||
@@ -286,10 +286,10 @@ Setting this attribute can adjust the alignment of child nodes, the desirable va
|
||||
| direction | Placement direction | string | vertical/horizontal | horizontal |
|
||||
| prefixCls | Prefix for space-items | string | el-space | - |
|
||||
| style | Extra style rules | string / Array<Object \| String> / Object | - | - |
|
||||
| spacer | Spacer | string / number / VNode | - | - |
|
||||
| spacer | Spacer | string / number / VNode | - | - |
|
||||
| size | Spacing size | string / number / [number, number] | - | 'small' |
|
||||
| wrap | Auto wrapping | boolean | true / false | false |
|
||||
### Space Slot
|
||||
| name | description |
|
||||
|----|----|
|
||||
| default | Items to be spaced |
|
||||
| default | Items to be spaced |
|
||||
|
||||
@@ -57,7 +57,7 @@
|
||||
### 控制间距的大小
|
||||
通过调整 `size` 的值来控制间距的大小
|
||||
|
||||
可供选择的内建的值有 `mini` `small` `medium` `large`, 分别对应 `8px` `12px` `16px` `20px`. 默认的间距大小为 `small` 也就是 `12px`
|
||||
可供选择的内建的值有 `mini`, `small`, `medium`, `large`, 分别对应 `4px`, `8px`, `12px`, `16px`. 默认的间距大小为 `small` 也就是 `8px`
|
||||
|
||||
您也可以通过自定义的 `size` 来控制大小,详见下一部分
|
||||
:::demo 使用 `size` 属性控制大小
|
||||
@@ -105,7 +105,7 @@ export default {
|
||||
:::
|
||||
|
||||
### 自定义 Size
|
||||
很多时候, 内建的大小不满足设计师的要求, 我们可以通过传入自己定义的大小 (数字类型) 来设置
|
||||
很多时候, 内建的大小不满足设计师的要求, 我们可以通过传入自己定义的大小 (数字类型) 来设置
|
||||
|
||||
:::demo
|
||||
```html
|
||||
@@ -166,7 +166,7 @@ export default {
|
||||
|
||||
#### 字符串 或 数字类型的分隔符
|
||||
|
||||
:::demo
|
||||
:::demo
|
||||
|
||||
```html
|
||||
<template>
|
||||
@@ -286,10 +286,10 @@ export default {
|
||||
| direction | 排列的方向 | string | vertical/horizontal | horizontal |
|
||||
| prefixCls | 给 space-items 的类名前缀 | string | el-space | - |
|
||||
| style | 额外样式 | string / Array<Object \| String> / Object | - | - |
|
||||
| spacer | 间隔符 | string / number / VNode | - | - |
|
||||
| spacer | 间隔符 | string / number / VNode | - | - |
|
||||
| size | 间隔大小 | string / number / [number, number] | - | 'small' |
|
||||
| wrap | 设置是否自动折行 | boolean | true / false | false |
|
||||
### Space Slot
|
||||
| name | 说明 |
|
||||
|----|----|
|
||||
| default | 需要添加间隔的元素 |
|
||||
| default | 需要添加间隔的元素 |
|
||||
|
||||
Reference in New Issue
Block a user