react-color颜色选择器使用+添加点击空白关闭颜色选择器 ChromePicker

需求如下:点击“A”时打开颜色选择器,在颜色选择器上改不同颜色时,A的下标颜色也跟着修改。点击颜色选择器以外的区域时,关闭颜色选择器。
import { ChromePicker } from 'react-color';

state = {
keyWordColor: '#f5222d', // 结果关键词颜色
keyWordPickerVisible: false, // 结果关键词颜色选择器可见性
};

// 当结果关键词颜色版打开时,判断鼠标点击范围,点击外层时,关闭颜色版,并且去除点击监听
onKeyWorkPickerClick = e => {
const { keyWordPickerVisible } = this.state;
try {
if (keyWordPickerVisible && e.target.compa

react-color颜色选择器使用+添加点击空白关闭颜色选择器 ChromePicker最先出现在Python成神之路

版权声明:
作者:Zad
链接:https://www.techfm.club/p/21223.html
来源:TechFM
文章版权归作者所有,未经允许请勿转载。

THE END
分享
二维码
< <上一篇
下一篇>>