From bd5651402a01a39e8553da2ca2e5155caed19651 Mon Sep 17 00:00:00 2001 From: chenjiahan Date: Sun, 5 Jul 2020 16:40:10 +0800 Subject: [PATCH] feat: CellGroup component --- src-next/cell-group/index.js | 38 ++++++++++++++++++++++++++++++++++ src-next/cell-group/index.less | 12 +++++++++++ 2 files changed, 50 insertions(+) create mode 100644 src-next/cell-group/index.js create mode 100644 src-next/cell-group/index.less diff --git a/src-next/cell-group/index.js b/src-next/cell-group/index.js new file mode 100644 index 000000000..bdf702908 --- /dev/null +++ b/src-next/cell-group/index.js @@ -0,0 +1,38 @@ +// Utils +import { createNamespace } from '../utils'; +import { BORDER_TOP_BOTTOM } from '../utils/constant'; + +const [createComponent, bem] = createNamespace('cell-group'); + +export default createComponent({ + props: { + title: String, + border: { + type: Boolean, + default: true, + }, + }, + + setup(props, { slots }) { + return function () { + const Group = ( +
+ {slots.default?.()} +
+ ); + + if (props.title || slots.title) { + return ( + <> +
+ {slots.title ? slots.title() : props.title} +
+ {Group} + + ); + } + + return Group; + }; + }, +}); diff --git a/src-next/cell-group/index.less b/src-next/cell-group/index.less new file mode 100644 index 000000000..bc42a8bea --- /dev/null +++ b/src-next/cell-group/index.less @@ -0,0 +1,12 @@ +@import '../style/var'; + +.van-cell-group { + background-color: @cell-group-background-color; + + &__title { + padding: @cell-group-title-padding; + color: @cell-group-title-color; + font-size: @cell-group-title-font-size; + line-height: @cell-group-title-line-height; + } +}