星级评价组件

  • 通过rate设置星级评价的分数, 最低0, 最高50, 5的倍数。
  • 通过phSize设置大小, 可选sm、md、lg。

主要属性和接口:

  • phSize(v1.1.2以下用size):星星的大小。分别为sm、md、lg, 默认sm。
    如:<Star phSize='lg' />
  • rate:星级评价的分数。最低0, 最高50, 5的倍数递增, 默认0。
    如:<Star rate={10} />

方法

事件

Extends Component
Defined in: src/star/index.js:20
Module: 基础组件

Available since 0.1.0

Constructor

Star

Star ()

Defined in src/star/index.js:20

Available since 0.1.0

Example:

import React, { Component } from "react"

import Star from "phoenix-ui/lib/star"
import Code from "./code/code"

export default class star extends Component{
    render(){
        return(
            <div>
                <h2 className="comp-title">Star</h2>
                <h3 className="comp-type">rate(默认0) 星级评价的分数</h3>
                <div className="content">
                    <Star />
                    <Star rate={5} />
                    <Star rate={15} />
                    <Star rate={20} />
                    <Star rate={25} />
                    <Star rate={30} />
                    <Star rate={35} />
                </div>
                <Code target="star-rate" />

                <h3 className="comp-type">phSize(默认sm) 星星大小</h3>
                <div className="content">
                    <Star rate={40} phSize="sm" />
                    <Star rate={45} phSize="md" />
                    <Star rate={50} phSize="lg" />
                </div>
                <Code target="star-phsize" />
            </div>
        );
    }
}

属性

classPrefix

String

样式前缀

Default:

'star'

phSize

String

星星大小

Default:

'sm'

rate

Number

星级评价分数

Default:

默认为0,最高50