Merge branch 'master' into hotfix/switch_loading_fix

This commit is contained in:
jiangruowei
2017-03-02 19:59:36 +08:00
38 changed files with 8080 additions and 41171 deletions

View File

@@ -0,0 +1,7 @@
## 安装
### ynpm安装
```
npm i @youzan/zanui-vue -S
```

View File

@@ -0,0 +1,23 @@
## 快速上手
### 完整引入
```
import Vue from 'vue';
import ZanUI from '@youzan/zanui-vue';
import '@youzan/zanui-vue/lib/zanui-css/index.css';
Vue.use(ZanUI);
```
### 按需引入
```
import Vue from 'vue';
import { Button, Cell } from '@youzan/zanui-vue';
import '@youzan/zanui-vue/lib/zanui-css/button.css';
import '@youzan/zanui-vue/lib/zanui-css/cell.css';
Vue.component(Button.name, Button);
Vue.component(Cell.name, Cell);
```

View File

@@ -1,4 +1,57 @@
## Steps 步骤条
### 基础用法
```html
<zan-steps :active="active" icon="certificate" icon-class="steps-success" title="等待商家发货" description="等待商家发货等待商家发货等待商家发货等待商家发货等待商家发货">
<zan-step>买家下单</zan-step>
<zan-step>商家接单</zan-step>
<zan-step>买家提货</zan-step>
<zan-step>交易完成</zan-step>
</zan-steps>
<script>
export default {
data() {
return {
active: 0
};
},
methods: {
nextStep() {
if (++this.active > 3) this.active = 0;
}
}
}
</script>
```
### 只显示步骤条
```html
<zan-steps :active="active">
<zan-step>买家下单</zan-step>
<zan-step>商家接单</zan-step>
<zan-step>买家提货</zan-step>
<zan-step>交易完成</zan-step>
</zan-steps>
```
### Steps API
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
| active | 当前激活的步骤从0开始 | Number | '' | '' |
| icon | 当前步骤的icon | string | '' | '' |
| iconClass | 当前步骤栏为icon添加的类 | string | '' | '' |
| title | 当前步骤从标题 | string | '' | '' |
| description | 当前步骤描述 | string | '' | '' |
### Steps Slot
| 名称 | 说明 |
|-----------|-----------|
| message-extra | 状态栏添加额外的元素 |