react-color 颜色选择器组件
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 颜色选择器组件的更多相关文章
- React Color使用
需求 - 要在react项目中实现颜色获取器功能 解决方案 - 使用react-color 依赖 - git地址:https://github.com/casesandberg/react-color ...
- HTML5的input color系统颜色选择器
前两天,我写了一篇<推荐两款jQuery色盘选择器>介绍,那是使用JavaScript实现的色盘,今天我给大家介绍HTML5的色盘选择器.HTML5有一个input类型为color,即颜色 ...
- 基于vue的颜色选择器color-picker
项目中有用到颜色选择器的童鞋们可以看过来了 关于color-picker的jquery的插件是有蛮多,不过vue组件没有吧,反正我没有找到, 虽然element-ui里面有这个,但是你愿意为了一个小功 ...
- 10个精选的颜色选择器Javascript脚本及其jQuery插件
Color picker即颜色选择器使我们在web开发中可能经常用到的组件,今天我们特意精选了10个超酷的颜色选择器实现,其中包括了javascript脚本 实现及其传说中的jQuery插件实现 ...
- 基于vue的颜色选择器vue-color-picker
项目中有用到颜色选择器的童鞋们可以看过来了 关于color-picker的jquery的插件是有蛮多,不过vue组件没有吧,反正我没有找到, 虽然element-ui里面有这个,但是你愿意为了一个小功 ...
- 【canvas系列】用canvas实现一个colorpicker(类似PS的颜色选择器)
每个浏览器都有自己的特点,比如今天要做的colorpicker就是,一千个浏览器,一千个哈姆雷特,一千个colorpicker.今天canvas系列就用canvas做一个colorpicker. ** ...
- 11个JavaScript颜色选择器插件
几年前,很难找到一个合适的颜色选择器.正好看到很多不错的JavaScript颜色选择器插件,故而把这些编译汇总.在本文,Web设计师和开发人员 Kevin Liew 选取了11个相应插件,有些会比较复 ...
- UWP 颜色选择器(ColorPicker) 和 自定义的Flyout(AdvancedFlyout)
ColorPicker 故事背景 项目里面需要一个像Winfrom里面那样的颜色选择器,如下图所示: 在网上看了一下.没有现成的东东可以拿来使用.大概查看了一下关于颜色的一些知识,想着没人种树,那就由 ...
- 改造过的JS颜色选择器
项目中用到颜色选择功能,在网上找了个颜色选择器,自己改了改代码.做成了一个可动态加载的颜色选择器. 把代码贴上,当是记录. /*Copyright(c)2009,www.supersite.me*/ ...
随机推荐
- 15数据库与ADO.Net
数据库与ADO.Net 数据库与ADO.Net 8.1 数据库基本概念 数据库提供了一种将信息集合在一起的方法.数据库应用系统主要由三部分组成:数据库管理系统(DBMS),是针对所有应用的,例如A ...
- 基于ant design form的二次封装
// standardForm.js import React, { PureComponent } from 'react'; import PropTypes from 'prop-types'; ...
- 第2节 hive基本操作:6、7、8
第1节 hive安装:6.hive的基本操作:7.创建数据库的语法:8.hive当中创建内部表的语法. hive的基本操作: 创建数据库与创建数据库表操作 创建数据库操作:create databas ...
- BZOJ 4695 最假女选手 线段树
题意: 给定一个长度为 N序列,编号从1 到 N.要求支持下面几种操作: 1.给一个区间[L,R] 加上一个数x 2.把一个区间[L,R] 里小于x 的数变成x 3.把一个区间[L,R] 里大于x ...
- mysql 替换数据库字段内容
去掉数据库字段单引号 update company_info set company=REPLACE(company,"'","");
- Python之面向对象函数式编程
Python之面向对象函数式编程 函数式编程的根本就是用 def 去模拟数学式的编程逻辑. 类似与 y = 2*x + 1 ,当x = 3 时,函数的结果y就得7. def test(x): retu ...
- 将一个list中的元素的某一属性取出来单独放到一个list里面
有很多时候我们会遇到这样的场景,就是要将一个list中的某一个元素中的某一属性单独拿出来放在一个新的list里面,这中时候,我们就可以用以下的方法来进行实现: List<DTO> item ...
- 输出一定范围unicode对应符号
#本程序没有考虑对0x的处理,请勿输入,直接输入16进制位即可 begin = input("起始点:") end = input("结束点:") b_int0 ...
- Qt笔记——添加菜单图片/添加资源文件
添加新文件,模板选择Qt分类中的Qt资源文件(Qt Resource File) 先添加前缀,点击"添加"按钮,然后选择"添加前缀",我们这里因为要添加图片,所 ...
- 编程数学-∑(求和符号)-Sigma
百度百科:∑ 在数学中,我们把它作为求和符号使用. 大写Σ用于数学上的总和符号,比如:∑Pi,其中i=1,2,...,T,即为求P1 + P2 + ... + PT的和.小写σ用于统计学上的标准差.西 ...