demo链接:github demo

安装: npm install react-color --save

有一下几种类型组件

<AlphaPicker /> <BlockPicker /> <ChromePicker/> <CirclePicker /> <CompactPicker /> <GithubPicker /> <HuePicker/> <MaterialPicker /><PhotoshopPicker /> <SketchPicker/> <SliderPicker/> <SwatchesPicker/>  <TwitterPicker/>

公有的组件API:

color 控制颜色选择器上的当前选中颜色,用来进行初始化颜色,或者用来保持父子组件颜色一致

onChange 修改颜色时触发。每次修改颜色都会传递一个函数来调用。他将被频繁调用。如果你只是想获得最后的选中颜色,使用 onChangeComplete 即可

onChangeComplete 颜色更改完成后触发,这时就可以保持父子组件颜色同步

私有的组件API:(某些特定组件才有的API)

colors 组件的默认颜色数组。通过他可以在多选的颜色组件中进行默认配置

根据项目中的使用情况,后面会继续记录

react-color 颜色选择器组件的更多相关文章

  1. React Color使用

    需求 - 要在react项目中实现颜色获取器功能 解决方案 - 使用react-color 依赖 - git地址:https://github.com/casesandberg/react-color ...

  2. HTML5的input color系统颜色选择器

    前两天,我写了一篇<推荐两款jQuery色盘选择器>介绍,那是使用JavaScript实现的色盘,今天我给大家介绍HTML5的色盘选择器.HTML5有一个input类型为color,即颜色 ...

  3. 基于vue的颜色选择器color-picker

    项目中有用到颜色选择器的童鞋们可以看过来了 关于color-picker的jquery的插件是有蛮多,不过vue组件没有吧,反正我没有找到, 虽然element-ui里面有这个,但是你愿意为了一个小功 ...

  4. 10个精选的颜色选择器Javascript脚本及其jQuery插件

     Color picker即颜色选择器使我们在web开发中可能经常用到的组件,今天我们特意精选了10个超酷的颜色选择器实现,其中包括了javascript脚本 实现及其传说中的jQuery插件实现 ...

  5. 基于vue的颜色选择器vue-color-picker

    项目中有用到颜色选择器的童鞋们可以看过来了 关于color-picker的jquery的插件是有蛮多,不过vue组件没有吧,反正我没有找到, 虽然element-ui里面有这个,但是你愿意为了一个小功 ...

  6. 【canvas系列】用canvas实现一个colorpicker(类似PS的颜色选择器)

    每个浏览器都有自己的特点,比如今天要做的colorpicker就是,一千个浏览器,一千个哈姆雷特,一千个colorpicker.今天canvas系列就用canvas做一个colorpicker. ** ...

  7. 11个JavaScript颜色选择器插件

    几年前,很难找到一个合适的颜色选择器.正好看到很多不错的JavaScript颜色选择器插件,故而把这些编译汇总.在本文,Web设计师和开发人员 Kevin Liew 选取了11个相应插件,有些会比较复 ...

  8. UWP 颜色选择器(ColorPicker) 和 自定义的Flyout(AdvancedFlyout)

    ColorPicker 故事背景 项目里面需要一个像Winfrom里面那样的颜色选择器,如下图所示: 在网上看了一下.没有现成的东东可以拿来使用.大概查看了一下关于颜色的一些知识,想着没人种树,那就由 ...

  9. 改造过的JS颜色选择器

    项目中用到颜色选择功能,在网上找了个颜色选择器,自己改了改代码.做成了一个可动态加载的颜色选择器. 把代码贴上,当是记录. /*Copyright(c)2009,www.supersite.me*/ ...

随机推荐

  1. 树形查询SQL优化一例

    上周五一哥们发了条SQL,让我看看,代码如下: SELECT COUNT(1) FROM (select m.sheet_id from cpm_main_sheet_history m, cpm_s ...

  2. Python之面向对象多态

    Python之面向对象多态 多态与多态性: 多态: 多态是指一类事物有多种形态,一个抽象类有多个子类,因而多态的概念依赖于继承. 1.序列类型有多种形态:字符串.列表.元组. 2.动物有多种形态:Pe ...

  3. python爬虫学习,使用requests库来实现模拟登录4399小游戏网站。

    1.首先分析请求,打开4399网站. 右键检查元素或者F12打开开发者工具.然后找到network选项, 这里最好勾选perserve log 选项,用来保存请求日志.这时我们来先用我们的账号密码登陆 ...

  4. android 如何从activity跳转到另一个activity下指定的fragment

    思路: 跳转到目标fragment所在的activity,并传递一个flag,来确定要到哪个fragment,根据该flag判断后,跳转到指定的fragment即可. 代码: 当前界面: intent ...

  5. Python基础 - pip导出依赖环境和安装依赖环境的命令

    导出:    pip freeze > requirements.txt 安装:    pip install -r requirements.txt

  6. Python中关于使用正则表达式相关的部分笔记

    一点点自己记的笔记,如果各位朋友看不懂,可以在评论区留言,会尽可能快的回复. 所有的知识点全部贴在代码上了,注释也写了. 建议大伙把代码拷到自己的机器上,运行,查看结果,然后,结合注释,再自己稍稍理解 ...

  7. Oracle 实现查询不区分大小写(设置数据库)

    转http://blog.csdn.net/shl7765856/article/details/7622756 查询数据的时候. SQL Server 默认 不区分大小写. 如果要区分,就要额外的设 ...

  8. Springboot+dubbo+zookeeper整合

    本想自己搭建一个Spring+dubbo+zookeeper整合好的框架,想寻找个最佳实现但是遇到各种各样的问题,只好自己看看dubbo starter的源码 整理如下: 通过打上断点来看配置的对不对 ...

  9. Lucene的分词_中文分词器介绍

    Paoding:庖丁解牛分词器.已经没有更新了. MMSeg:搜狗的词库. MMSeg分词器的一些截图: 步骤: 1.导入包 2.创建的时候使用MMSegAnalyzer分词器

  10. PS注意点

    2.颜色 设计师应该具备审美能力. 3.实验 不断的练习会让你学习到更多的东西,请不要给自己太多压力,你的付出不会仅仅只让你原地踏步,要坚持.   填充和不透明的掌握. 还有流量的使用.   填充是一 ...