This commit is contained in:
cookfront 2017-03-21 20:50:34 +08:00
parent 1c0d395841
commit 2b71650c09
26 changed files with 139 additions and 122 deletions

View File

@ -27,15 +27,16 @@ export default {
height: 100%;
overflow: scroll;
h2 {
font-size: 28px;
color: #1f2d3d;
section > h2 {
font-size: 36px;
color: #333;
margin: 20px 0;
line-height: 40px;
line-height: 1.5;
}
section > h3 {
font-size: 22px;
font-size: 30px;
color: #333;
margin: 23px 0;
}
@ -64,19 +65,21 @@ export default {
box-sizing: border-box;
overflow: auto;
height: inherit;
margin-left: 320px;
margin-left: 220px;
padding: 0 20px;
section > p {
font-size: 14px;
color: #5e6d82;
color: #666;
margin: 14px 0;
}
p > code {
background-color: #eee;
p > code {
background-color: #F2F2F2;
display: inline-block;
border: 1px solid #E5E5E5;
padding: 2px 4px;
color: #26a2ff;
color: #333;
}
}
@ -90,15 +93,14 @@ export default {
border-collapse: collapse;
width: 100%;
background-color: #fff;
color: #5e6d82;
color: #333;
font-size: 14px;
margin-bottom: 45px;
th {
text-align: left;
border-top: 1px solid #eaeefb;
border-bottom: 1px solid #eaeefb;
background-color: #eff2f7;
border: 1px solid #E5E5E5;
background-color: #F2F2F2;
padding: 10px;
&:first-child {
@ -107,8 +109,16 @@ export default {
}
td {
border-bottom: 1px solid #eaeefb;
border: 1px solid #E5E5E5;
padding: 10px;
code {
background-color: #F2F2F2;
display: inline-block;
border: 1px solid #E5E5E5;
padding: 2px 4px;
color: #333;
}
}
}
</style>

View File

@ -62,11 +62,12 @@
<style lang="css">
.side-nav {
width: 320px;
width: 220px;
box-sizing: border-box;
padding: 40px 20px;
border-right: 1px solid #E5E5E5;
float: left;
background: #f9fafb;
background-color: #fff;
height: inherit;
overflow: auto;
@ -82,7 +83,7 @@
.nav-item {
a {
font-size: 16px;
color: #5e6d82;
color: #333;
line-height: 40px;
height: 40px;
margin: 0;
@ -93,7 +94,7 @@
transition: all .3s;
&.active {
color: #20a0ff;
color: #3388FF;
}
}
.nav-item {
@ -104,16 +105,15 @@
font-size: 13px;
padding-left: 24px;
&:hover {
color: #20a0ff;
color: #3388FF;
}
}
}
}
.nav-group__title {
font-size: 12px;
color: #99a9bf;
color: #666;
padding-left: 8px;
line-height: 26px;
margin-top: 10px;

View File

@ -100,11 +100,11 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| actions | 行动按钮数组 | Array | [] | |
| title | 标题 | String | | |
| cancelText | 取消按钮文案 | String | | |
| overlay | 是否显示遮罩 | Boolean | | |
| closeOnClickOverlay | 点击遮罩是否关闭ActionSheet | Boolean | | |
| actions | 行动按钮数组 | `Array` | `[]` | |
| title | 标题 | `String` | | |
| cancelText | 取消按钮文案 | `String` | | |
| overlay | 是否显示遮罩 | `Boolean` | | |
| closeOnClickOverlay | 点击遮罩是否关闭`ActionSheet` | `Boolean` | | |
### actions
@ -115,4 +115,4 @@ export default {
| name | 标题 |
| subname | 二级标题 |
| className | 为对应列添加特殊的`class` |
| loading | 是否是loading状态 |
| loading | 是否是`loading`状态 |

View File

@ -1,4 +1,4 @@
## Badge 组件
## Badge
### 基础用法
@ -17,13 +17,13 @@
| 参数 | 说明 | 类型 | 默认值 | 必须 |
|-----------|-----------|-----------|-------------|-------------|
| active-key | 激活的badge的索引 | string | '0'但必须子badge里的mark是有0位索引 | |
| active-key | 激活的`badge`的索引 | `string` | `0`但必须子badge里的mark是有`0`位索引 | |
### z-badge API
| 参数 | 说明 | 类型 | 默认值 | 必须 |
|-----------|-----------|-----------|-------------|-------------|
| mark | badge的唯一key值 | string | '' | required |
| title | badge的文案标题 | string | '' | required |
| info | 当前badge的提示消息数量 | string | '' | |
| url | 跳转链接 | string | 全连接直接跳转或者hash | |
| mark | badge的唯一key值 | `string` | `''` | `required` |
| title | badge的文案标题 | `string` | `''` | `required` |
| info | 当前badge的提示消息数量 | `string` | `''` | |
| url | 跳转链接 | `string` | 全连接直接跳转或者hash | |

View File

@ -15,11 +15,11 @@
}
</style>
## Button组件
## Button 按钮
### 按钮功能
只接受primary, default, danger三种类型默认default。
只接受`primary`, `default`, `danger`三种类型,默认`default`
:::demo 按钮功能
```html
@ -51,7 +51,7 @@
### 按钮尺寸
只接受large, normal, small, mini四种尺寸默认normal。
只接受`large`, `normal`, `small`, `mini`四种尺寸,默认`normal`
:::demo 按钮尺寸
```html
@ -76,7 +76,7 @@
### 自定义按钮标签
按钮默认是button标签可以使用tag属性修改为一个a标签。
按钮默认是`button`标签,可以使用`tag`属性修改为一个`a`标签。
:::demo 自定义按钮标签
```html
@ -90,7 +90,7 @@
### loading按钮
表示loading状态
表示`loading`状态
:::demo loading按钮
```html
@ -123,9 +123,9 @@
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| type | 按钮类型 | string | 'default' | 'primary', 'danger' |
| size | 按钮尺寸 | string | 'normal' | 'large', 'small', 'mini' |
| tag | 按钮标签 | string | 'button' | 'a', 'span', ... |
| diabled | 按钮是否禁用 | Boolean | | |
| block | 按钮是否显示为块级元素 | Boolean | | |
| type | 按钮类型 | `string` | `default` | `primary`, `danger` |
| size | 按钮尺寸 | `string` | `normal` | `large`, `small`, `mini` |
| tag | 按钮标签 | `string` | `button` | `a`, `span`, ... |
| diabled | 按钮是否禁用 | `boolean` | | |
| block | 按钮是否显示为块级元素 | `boolean` | | |

View File

@ -41,9 +41,9 @@
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| thumb | 左侧图片 | string | '' | '' |
| title | 标题 | string | '' | '' |
| desc | 描述 | string | '' | '' |
| thumb | 左侧图片 | `string` | | |
| title | 标题 | `string` | | |
| desc | 描述 | `string` | | |
### Slot

View File

@ -16,7 +16,7 @@ export default {
};
</script>
## Cell 组件
## Cell
### 基础用法
@ -102,17 +102,17 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| icon | 左侧图标 | string | '' | '' |
| title | 左侧标题 | string | '' | '' |
| value | 右侧内容 | string | '' | '' |
| isLink | 是否为链接,链接会在右侧出现箭头 | boolean | '' | '' |
| url | 跳转链接 | string | '' | '' |
| label | 描述信息,显示在标题下方 | string | '' | '' |
| icon | 左侧图标 | `string` | | |
| title | 左侧标题 | `string` | | |
| value | 右侧内容 | `string` | | |
| isLink | 是否为链接,链接会在右侧出现箭头 | `boolean` | | |
| url | 跳转链接 | `string` | | |
| label | 描述信息,显示在标题下方 | `string` | | |
### Slot
| name | 描述 |
|-----------|-----------|
| - | 自定义显示内容 |
| icon | 自定义icon |
| title | 自定义title |
| icon | 自定义`icon` |
| title | 自定义`title` |

View File

@ -170,14 +170,14 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| disabled | 是否禁用单选框 | Boolean | false | |
| name | 根据这个来判断radio是否选中 | Boolean | false | |
| disabled | 是否禁用单选框 | `boolean` | `false` | |
| name | 根据这个来判断radio是否选中 | `boolean` | `false` | |
### CheckboxGroup API
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| disabled | 是否禁用单选框 | Boolean | false | |
| disabled | 是否禁用单选框 | `boolean` | `false` | |
### CheckboxGroup Event

View File

@ -89,5 +89,5 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| title | 标题 | String | '' | |
| message | 内容 | String | '' | |
| title | 标题 | `string` | | |
| message | 内容 | `string` | | |

View File

@ -101,15 +101,15 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| type | 输入框类型 | string | text | text, number, email, url, tel, date, datetime, password, textarea |
| placeholder | 输入框placeholder | string | '' | |
| value | 输入框的值 | string | '' | |
| label | 输入框标签 | string | '' | |
| disabled | 是否禁用输入框 | boolean | false | |
| error | 输入框是否有错误 | boolean | false | |
| readonly | 输入框是否只读 | boolean | false | |
| maxlength | 输入框maxlength | [String, Number] | '' | |
| rows | textarea rows | [String, Number] | '' | |
| cols | textarea cols | [String, Number] | '' | |
| autosize | 自动调整高度(仅支持textarea) | Boolean | false | true, false |
| type | 输入框类型 | `string` | `text` | `text`, `number`, `email`, `url`, `tel`, `date`, `datetime`, `password`, `textarea` |
| placeholder | 输入框placeholder | `string` | | |
| value | 输入框的值 | `string` | | |
| label | 输入框标签 | `string` | | |
| disabled | 是否禁用输入框 | `boolean` | `false` | |
| error | 输入框是否有错误 | `boolean` | `false` | |
| readonly | 输入框是否只读 | `boolean` | `false` | |
| maxlength | 输入框maxlength | `string`, `number` | | |
| rows | textarea rows | `string`, `number` | | |
| cols | textarea cols | `string`, `number` | | |
| autosize | 自动调整高度(仅支持textarea) | `boolean` | `false` | `true`, `false` |

View File

@ -49,4 +49,4 @@
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| name | icon名称 | string | '' | |
| name | icon名称 | `string` | `''` | |

View File

@ -17,7 +17,7 @@
}
</style>
## Loading
## Loading 加载中
### 基础用法
@ -43,3 +43,10 @@
</div>
```
:::
### API
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| color | `loading`颜色 | `string` | `black` | `black`, `white` |
| type | `loading`类型 | `string` | `gradient-circle` | `gradient-circle`, `circle` |

View File

@ -84,9 +84,9 @@
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| title | 标题 | string | '' | '' |
| desc | 描述 | string | '' | '' |
| status | 状态 | string | '' | '' |
| title | 标题 | `string` | | |
| desc | 描述 | `string` | | |
| status | 状态 | `string` | | |
### Slot

View File

@ -127,10 +127,10 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| visibileColumnCount | 每一列可见备选元素的个数 | Number | 5 | |
| itemHeight | 选中元素区高度 | Number | 44 | |
| columns | 对象数组,配置每一列显示的数据 | Array | | |
| showToolbar | 是否在组件顶部显示一个toolbar | Boolean | true | |
| visibileColumnCount | 每一列可见备选元素的个数 | `number` | `5` | |
| itemHeight | 选中元素区高度 | `number` | `44` | |
| columns | 对象数组,配置每一列显示的数据 | `Array` | | |
| showToolbar | 是否在组件顶部显示一个toolbar | `Boolean` | `true` | |
### columns

View File

@ -145,4 +145,4 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| value | 利用`v-model`绑定当前组件是否显示 | Boolean | '' | |
| value | 利用`v-model`绑定当前组件是否显示 | `boolean` | | |

View File

@ -10,7 +10,7 @@
</style>
## Switch组件
## Progress
### 基础用法
@ -64,9 +64,9 @@
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| inactive | 是否只会 | boolean | false | true, false |
| percentage | 进度百分比 | number | false | 0-100 |
| pivotText | 文字显示 | string | 百分比文字 | - |
| color | 进度条颜色 | string | #38f | hexvalue |
| textColor | 进度条文字颜色 | string | #fff | hexvalue |
| inactive | 是否只会 | `boolean` | `false` | `true`, `false` |
| percentage | 进度百分比 | `number` | `false` | `0-100` |
| pivotText | 文字显示 | `string` | 百分比文字 | - |
| color | 进度条颜色 | `string` | `#38f` | hexvalue |
| textColor | 进度条文字颜色 | `string` | `#fff` | hexvalue |

View File

@ -57,9 +57,9 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| min | 最小值 | string/number | 1 | '' |
| max | 最大值 | string/number | '' | '' |
| step | 步数 | string/number | 1 | '' |
| disabled | 是否被禁用了 | boolean | false | '' |
| defaultValue | 默认值 | string/number | 1 | '' |
| min | 最小值 | `string`, `number` | `1` | |
| max | 最大值 | `string`, `number` | | |
| step | 步数 | `string`, `number` | `1` | |
| disabled | 是否被禁用了 | `boolean` | `false` | |
| defaultValue | 默认值 | `string`, `number` | `1` | |

View File

@ -119,14 +119,14 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| disabled | 是否禁用单选框 | Boolean | false | |
| name | 根据这个来判断radio是否选中 | Boolean | false | |
| disabled | 是否禁用单选框 | `boolean` | `false` | |
| name | 根据这个来判断radio是否选中 | `boolean` | `false` | |
### RadioGroup API
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| disabled | 是否禁用单选框 | Boolean | false | |
| disabled | 是否禁用单选框 | `boolean` | `false` | |
### RadioGroup Event

View File

@ -31,4 +31,4 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 必须 |
|-----------|-----------|-----------|-------------|-------------|
| placeholder | input的placeholder文案 | string | | |
| placeholder | `input``placeholder`文案 | `string` | | |

View File

@ -79,11 +79,11 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| active | 当前激活的步骤从0开始 | Number | '' | '' |
| icon | 当前步骤的icon | string | '' | '' |
| iconClass | 当前步骤栏为icon添加的类 | string | '' | '' |
| title | 当前步骤从标题 | string | '' | '' |
| description | 当前步骤描述 | string | '' | '' |
| active | 当前激活的步骤从0开始 | `number` | | |
| icon | 当前步骤的icon | `string` | | |
| iconClass | 当前步骤栏为icon添加的类 | `string` | | |
| title | 当前步骤从标题 | `string` | | |
| description | 当前步骤描述 | `string` | | |
### Steps Slot

View File

@ -89,6 +89,6 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| checked | 开关状态 | boolean | false | true, false |
| loading | loading状态 | boolean | false | true, false |
| disabled | 禁用状态 | boolean | false | true, false |
| checked | 开关状态 | `boolean` | `false` | `true`, `false` |
| loading | loading状态 | `boolean` | `false` | `true`, `false` |
| disabled | 禁用状态 | `boolean` | `false` | `true`, `false` |

View File

@ -124,14 +124,14 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选 |
|-----------|-----------|-----------|-------------|-------------|
| classtype | 两种UI | string | line | card |
| active | 默认激活的tab | string || number | 0 | |
| navclass | tabs的内部nav上的自定义classname | string | '' | |
| classtype | 两种UI | `string` | `line` | `line`, `card` |
| active | 默认激活的tab | `string`, `number` | `0` | |
| navclass | tabs的内部nav上的自定义classname | `string` | | |
### zan-tab API
| 参数 | 说明 | 类型 | 默认值 | 必须 |
| 参数 | 说明 | 类型 | 默认值 | 可选 |
|-----------|-----------|-----------|-------------|-------------|
| title | tab的标题 | string | '' | required |
| disable | 是否禁用这个tab | Boolean | false | |
| title | tab的标题 | `string` | | |
| disable | 是否禁用这个tab | `boolean` | `false` | |

View File

@ -52,9 +52,9 @@
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| plain | 是否是空心tag | boolean | false | '' |
| mark | 是否是标记 | boolean | false | '' |
| type | tag类型 | string | '' | 'primary', 'success', 'danger' |
| plain | 是否是空心tag | `boolean` | `false` | |
| mark | 是否是标记 | `boolean` | `false` | |
| type | tag类型 | `string` | `''` | `primary`, `success`, `danger` |
### Slot

View File

@ -100,5 +100,5 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| type | 类型 | String | 'text' | 'text', 'loading', 'success', 'failure' |
| message | 内容 | String | '' | - |
| type | 类型 | `string` | `text` | `text`, `loading`, `success`, `failure` |
| message | 内容 | `string` | | - |

View File

@ -42,10 +42,10 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| result-type | 读取文件的方式以base64的方式读取以文本的方式读取 | String | 'dataUrl' | 'dataUrl','text' |
| disable | 是否禁用上传,在图片上传期间设置为true禁止用户点击此组件上传图片 | boolean | false | |
| before-read | 读文件之前的钩子,参数为选择的文件,若返回 false 则停止读取文件。 | Function | | |
| file-readed | 文件读完之后出发此事件,参数为{name:'文件名',type:'文件类型',size:'文件大小',content:'读的内容'} | Function | | |
| result-type | 读取文件的方式以base64的方式读取以文本的方式读取 | `string` | `dataUrl` | `dataUrl`, `text` |
| disable | 是否禁用上传,在图片上传期间设置为true禁止用户点击此组件上传图片 | `boolean` | `false` | |
| before-read | 读文件之前的钩子,参数为选择的文件,若返回 false 则停止读取文件。 | `Function` | | |
| file-readed | 文件读完之后出发此事件,参数为{name:'文件名',type:'文件类型',size:'文件大小',content:'读的内容'} | `Function` | | |
### Slot

View File

@ -76,6 +76,6 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| waterfall-disabled | 在vue对象中表示是否禁止瀑布流触发的key值 | String | - | |
| waterfall-offset | 触发瀑布流加载的阈值 | Number | 300 | |
| waterfall-disabled | 在vue对象中表示是否禁止瀑布流触发的key值 | `string` | - | |
| waterfall-offset | 触发瀑布流加载的阈值 | `number` | `300` | |