Badge徽章标记

  • 主要是用来提供不同颜色的标识, 通过phStyle来改变颜色, 可选primary、warning、danger、info、error、success。
  • 不提供默认回调, 但支持自定义className,事件等操作。

主要属性和接口:

  • phStyle:徽章颜色, 默认primary
    如:<Badge phStyle="info">惠</Badge>

方法

事件

Extends Component
Defined in: src/Badge.js:5
Module: 标签组件

Available since 0.1.0

Constructor

Badge

Badge ()

Defined in src/Badge.js:5

Available since 0.1.0

Example:

import React, { Component } from "react";
import {Badge} from "phoenix-ui";
import Code from "./code/code";

export default class badge extends Component{
    render(){
        return(
            <div>
                <h2 className="comp-title">Badge</h2>
                <h3 className="comp-type">phStyle(默认primary) 徽章颜色</h3>
                <div className="content">
                    <Badge>惠</Badge>
                    <Badge phStyle="success">惠</Badge>
                    <Badge phStyle="info">惠</Badge>
                    <Badge phStyle="danger">惠</Badge>
                    <Badge phStyle="error">惠</Badge>
                    <Badge phStyle="warning">惠</Badge>
                </div>
                <Code target="badge-phstyle" />
            </div>
        );
    }
}

属性

classPrefix

String

Defined in src/Badge.js:25

样式前缀

Default:

'badge'

phStyle

String

Defined in src/Badge.js:32

badge徽章颜色[primary、warning、danger、info、error、success], 默认primary

Default:

'primary'