Label

标签组件

  • 通过phStyle来改变颜色, 可选primary、warning、danger、info、error、success。
  • 通过phSize设置大小, 可选sm、md、lg。
  • 不提供默认回调, 但支持自定义className，事件等操作。

主要属性和接口：

  • phStyle:标签颜色, 默认primary
    如：<Label phStyle="info">惠</Label>
  • phSize:标签大小, 默认sm
    如：<Label phSize="lg">惠</Label>

方法

属性

事件

Extends Component
Defined in: src/Label.js:14
Module: 标签组件

Available since 0.1.0

Constructor

Label

Label ()

Defined in src/Label.js:14

Available since 0.1.0

Example:

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

export default class Labels extends Component{
    render(){
        return(
            <div>
                <h2 className="comp-title">Label</h2>
                <h3 className="comp-type">phStyle(默认primary) 标签颜色</h3>
                <div className="content">
                    <Label>惠</Label>
                    <Label phStyle="success">惠</Label>
                    <Label phStyle="info">惠</Label>
                    <Label phStyle="danger">惠</Label>
                    <Label phStyle="error">惠</Label>
                    <Label phStyle="warning">惠</Label>
                </div>
                <Code target="label-phstyle" />

                <h3 className="comp-type">phSize(默认sm) 标签大小</h3>
                <div className="content">
                    <Label>惠</Label>
                    <Label phSize="md">惠</Label>
                    <Label phSize="lg">惠</Label>
                </div>
                <Code target="label-phsize" />
            </div>
        );
    }
}

属性

classPrefix

String

Defined in src/Label.js:37

样式前缀

Default:

'label'

phSize

String

Defined in src/Label.js:44

label标签大小[lg、md、sm], 默认为sm

Default:

'sm'

phStyle

String

Defined in src/Label.js:51

label标签颜色[primary、warning、danger、info、error、success], 默认primary

Default:

'primary'