bee-radio-group

0.1.3 • Public • Published

bee-radio-group

npm version Build Status Coverage Status

单选框组合

RadioGroup将Radio集成为自己的子组件。故API需注意。

使用

使用单独的bee-radio-group包

组件引入

先进行下载bee-radio-group包

npm install --save bee-radio-group

组件调用

import RadioGroup from 'bee-radio-group';
 
const RadioApp = React.createClass({
  getInitialState() {
    return {selectedValue: 'apple'};
  },
 
  handleChange(value) {
    this.setState({selectedValue: value});
  },
 
  render() {
    return (
      <RadioGroup
        name="fruit"
        selectedValue={this.state.selectedValue}
        onChange={this.handleChange}>
        <label>
          <RadioGroup.Radio colors="warning" value="apple" >apple</RadioGroup.Radio>
        </label>
        <label>
          <RadioGroup.Radio value="orange" >Orange</RadioGroup.Radio>
        </label>
        <label>
          <RadioGroup.Radio value="watermelon" >Watermelon</RadioGroup.Radio>
        </label>
      </RadioGroup>
    );
  }
});
 
React.render(<RadioApp />, document.getElementById('target'));
 

样式引入

  • 可以使用link引入dist目录下bee-radio.css
<link rel="stylesheet" href="./node_modules/build/bee-radio-group.css">
  • 可以在js中import样式
import "./node_modules/src/RadioGroup.scss"
//或是
import "./node_modules/build/bee-radio-group.css"

API

RadioGroup.Radio

参数 说明 类型 默认值
color one of: primary success info error warning dark string ''
disabled 是否可用 bool false

RadioGroup

参数 说明 类型 默认值
onChange 暴露在外层的触发radio是否选中的方法 func ''
selectedValue 被选中的radio值 string ''
name radio组名 string ''
Children Radio子组件 obj ''

开发调试

$ git clone https://github.com/tinper-bee/bee-radio-group
cd bee-radio-group
$ npm install
$ npm run dev

Package Sidebar

Install

npm i bee-radio-group

Weekly Downloads

1

Version

0.1.3

License

MIT

Last publish

Collaborators

  • ahua52