colorpicker
react colorpicker component for tinper-bee
可定制的取色板组件
使用
使用单独的colorpicker包
组件引入
先进行下载bee-colorpicker包
npm install --save bee-colorpicker
组件调用
import ColorPicker from 'bee-colorpicker';
ReactDOM.render(
<ColorPicker label="颜色" />
, document.getElementById('target'));样式引入
- 可以使用link引入build目录下ColorPicker.css
<link rel="stylesheet" href="./node_modules/bee-colorpicker/build/ColorPicker.css">
- 可以在js中import样式
import "./node_modules/bee-colorpicker/src/ColorPicker.scss"
//或是
import "./node_modules/bee-colorpicker/build/ColorPicker.css"API
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| className | 类名 | string | - |
| value | input当前值 | string | - |
| required | 是否是必输项 | bool | false |
| disabled | 是否禁用 | bool | false |
| disabledAlpha | 是否禁用透明度 | bool | false |
| placeholder | input中的提示信息 | string | - |
| onChange | input值发生改变触发的回调 | func | - |
| autoCalculate | 根据选中的颜色自动计算比其 浅一色度/深一色度 的色值 | func | - |
开发调试
$ npm install -g bee-tools
$ git clone https://github.com/tinper-bee/bee-colorpicker
$ cd bee-colorpicker
$ npm install
$ npm run dev
