mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-05-22 22:49:15 +08:00
[improvement] add Cell props mixin (#2189)
This commit is contained in:
parent
fe805af905
commit
d8ff9f3d34
@ -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
|
||||||
|
|
||||||
|
@ -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: {
|
||||||
|
@ -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
|
||||||
|
|
||||||
|
@ -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
|
||||||
|
@ -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
|
||||||
|
|
||||||
|
@ -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
|
||||||
|
|
||||||
|
@ -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
22
packages/mixins/cell.js
Normal 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
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
Loading…
x
Reference in New Issue
Block a user