mp-colorui/dist/h5/components/card/index.js

MP ColorUI 是一款基于 Taro 框架并且联合 Color-UI CSS 库开发的多端 UI 组件库（支持小程序端和H5端）

import Taro from "@tarojs/taro-h5";
import Nerv from "nervjs";
import { View } from "@tarojs/components";
import { BG_COLOR_LIST } from "../../lib/model";
import ClText from "../text/index";
import { classNames } from "../../lib/index";
import "./index.scss";
export default class ClCard extends Taro.Component {
  render() {
    const props = this.props;

    const typeClassName = props.type === "full" ? "no-card" : "";
    const colorClassName = props.bgColor ? BG_COLOR_LIST[props.bgColor] : "bg-white";
    return <View className={classNames([`cu-card case ${typeClassName}`], props.className)} style={Object.assign({}, props.style)}>
      <View className={classNames(["cu-item", {
        shadow: props.shadow
      }, colorClassName, {
        cu_card_active: props.active
      }])}>
        {props.title && props.title.text ? <View className="cu_card__title-line padding">
            <ClText {...props.title} />
          </View> : ""}
        {this.props.renderTitle}
        <View className="padding">{this.props.children}</View>
      </View>
    </View>;
  }

}
ClCard.options = {
  addGlobalClass: true
};
ClCard.defaultProps = {
  type: "card",
  bgColor: "white",
  shadow: true,
  active: false,
  title: {}
};