[improvement] add Cell props mixin (#2189)

This commit is contained in:
neverland 2018-11-30 15:45:50 +08:00 committed by GitHub
parent fe805af905
commit d8ff9f3d34
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 45 additions and 38 deletions

View File

@ -103,6 +103,9 @@ Vue.use(Cell).use(CellGroup);
| is-link | Whether to show link icon | `Boolean` | `false` | | is-link | Whether to show link icon | `Boolean` | `false` |
| required | Whether to show required mark | `Boolean` | `false` | | required | Whether to show required mark | `Boolean` | `false` |
| arrow-direction | Can be set to `left` `up` `down` | `String` | - | | arrow-direction | Can be set to `left` `up` `down` | `String` | - |
| title-class | Title className | `String` | - |
| value-class | Value className | `String` | - |
| label-class | Label className | `String` | - |
### Cell Event ### Cell Event

View File

@ -52,6 +52,7 @@
<script> <script>
import Icon from '../icon'; import Icon from '../icon';
import CellMixin from '../mixins/cell';
import RouterLink from '../mixins/router-link'; import RouterLink from '../mixins/router-link';
import create from '../utils/create-basic'; import create from '../utils/create-basic';
@ -62,26 +63,12 @@ export default create({
Icon Icon
}, },
mixins: [RouterLink], mixins: [CellMixin, RouterLink],
props: { props: {
icon: String,
size: String, size: String,
center: Boolean,
isLink: Boolean,
required: Boolean,
clickable: Boolean, clickable: Boolean,
titleClass: String, arrowDirection: String
valueClass: String,
labelClass: String,
title: [String, Number],
value: [String, Number],
label: [String, Number],
arrowDirection: String,
border: {
type: Boolean,
default: true
}
}, },
computed: { computed: {

View File

@ -105,6 +105,9 @@ Vue.use(Cell).use(CellGroup);
| required | 是否显示表单必填星号 | `Boolean` | `false` | - | | required | 是否显示表单必填星号 | `Boolean` | `false` | - |
| center | 是否使内容垂直居中 | `Boolean` | `false` | 1.0.3 | | center | 是否使内容垂直居中 | `Boolean` | `false` | 1.0.3 |
| arrow-direction | 箭头方向,可选值为 `left` `up` `down` | `String` | - | 1.1.10 | | arrow-direction | 箭头方向,可选值为 `left` `up` `down` | `String` | - | 1.1.10 |
| title-class | 左侧标题额外类名 | `String` | - | 1.4.8 |
| value-class | 右侧内容额外类名 | `String` | - | 1.4.8 |
| label-class | 描述信息额外类名 | `String` | - | 1.4.8 |
### Cell Event ### Cell Event

View File

@ -39,24 +39,17 @@
<script> <script>
import { raf } from '../utils/raf'; import { raf } from '../utils/raf';
import create from '../utils/create'; import create from '../utils/create';
import findParent from '../mixins/find-parent'; import CellMixin from '../mixins/cell';
import FindParent from '../mixins/find-parent';
export default create({ export default create({
name: 'collapse-item', name: 'collapse-item',
mixins: [findParent], mixins: [CellMixin, FindParent],
props: { props: {
icon: String,
label: String,
name: [String, Number], name: [String, Number],
title: [String, Number],
value: [String, Number],
disabled: Boolean, disabled: Boolean,
border: {
type: Boolean,
default: true
},
isLink: { isLink: {
type: Boolean, type: Boolean,
default: true default: true

View File

@ -92,6 +92,9 @@ export default {
| border | Whether to show inner border | `Boolean` | `true` | | border | Whether to show inner border | `Boolean` | `true` |
| disabled | Whether to disabled collapse | `Boolean` | `false` | | disabled | Whether to disabled collapse | `Boolean` | `false` |
| is-link | Whether to show link icon | `Boolean` | `true` | | is-link | Whether to show link icon | `Boolean` | `true` |
| title-class | Title className | `String` | - |
| value-class | Value className | `String` | - |
| label-class | Label className | `String` | - |
### CollapseItem Slot ### CollapseItem Slot

View File

@ -97,13 +97,16 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 版本 | | 参数 | 说明 | 类型 | 默认值 | 版本 |
|------|------|------|------|------|------| |------|------|------|------|------|------|
| name | 唯一标识符,默认为索引值 | `String | Number` | `index` | - | | name | 唯一标识符,默认为索引值 | `String | Number` | `index` | - |
| title | 标题栏左侧内容 | `String | Number` | - | - |
| icon | 标题栏左侧图标名称或图片链接,可选值见 Icon 组件 | `String` | - | 1.2.1 | | icon | 标题栏左侧图标名称或图片链接,可选值见 Icon 组件 | `String` | - | 1.2.1 |
| title | 标题栏左侧内容 | `String | Number` | - | - |
| value | 标题栏右侧内容 | `String | Number` | - | 1.2.1 | | value | 标题栏右侧内容 | `String | Number` | - | 1.2.1 |
| label | 标题栏描述信息 | `String` | - | 1.2.1 | | label | 标题栏描述信息 | `String | Number` | - | 1.2.1 |
| border | 是否显示内边框 | `Boolean` | `true` | 1.2.1 | | border | 是否显示内边框 | `Boolean` | `true` | 1.2.1 |
| is-link | 是否展示标题栏右侧箭头并开启点击反馈 | `Boolean` | `true` | 1.2.1 | | is-link | 是否展示标题栏右侧箭头并开启点击反馈 | `Boolean` | `true` | 1.2.1 |
| disabled | 是否禁用面板 | `Boolean` | `false` | 1.3.6 | | disabled | 是否禁用面板 | `Boolean` | `false` | 1.3.6 |
| title-class | 左侧标题额外类名 | `String` | - | 1.4.8 |
| value-class | 右侧内容额外类名 | `String` | - | 1.4.8 |
| label-class | 描述信息额外类名 | `String` | - | 1.4.8 |
### CollapseItem Slot ### CollapseItem Slot

View File

@ -73,6 +73,7 @@
<script> <script>
import create from '../utils/create'; import create from '../utils/create';
import CellMixin from '../mixins/cell';
import { isObj } from '../utils'; import { isObj } from '../utils';
export default create({ export default create({
@ -80,16 +81,12 @@ export default create({
inheritAttrs: false, inheritAttrs: false,
mixins: [CellMixin],
props: { props: {
value: [String, Number],
icon: String,
label: String,
error: Boolean, error: Boolean,
center: Boolean,
isLink: Boolean,
leftIcon: String, leftIcon: String,
readonly: Boolean, readonly: Boolean,
required: Boolean,
clearable: Boolean, clearable: Boolean,
labelAlign: String, labelAlign: String,
inputAlign: String, inputAlign: String,
@ -99,10 +96,6 @@ export default create({
type: { type: {
type: String, type: String,
default: 'text' default: 'text'
},
border: {
type: Boolean,
default: true
} }
}, },

22
packages/mixins/cell.js Normal file
View File

@ -0,0 +1,22 @@
/**
* Common Cell Props
*/
export default {
props: {
icon: String,
center: Boolean,
isLink: Boolean,
required: Boolean,
titleClass: String,
valueClass: String,
labelClass: String,
value: [String, Number],
label: [String, Number],
title: [String, Number],
border: {
type: Boolean,
default: true
}
}
};