react antd 怎样用颜色选择器关联背景颜色

可以使用onChange事件来监听颜色选择器的变化，然后更新组件的style属性中的backgroundColor值。具体实现可以参考以下代码：
import React, { useState } from 'react';
import { SketchPicker } from 'react-color';
import { Button } from 'antd';

function ColorPicker() {
const [color, setColor] = useState('#ffffff');

const handleChange = (newColor) => {
setColor(newColor.hex);
};

const handleButtonClick = () => {
// do something with the selected color
};

return (
<div style={{ backgroundColor: color }}>
<SketchPicker color={color} onChange={handleChange} />
<Button onClick={handleButtonClick}>Save</Button>
</div>
);
}
登录后复制
上述代码中，SketchPicker组件是react-color库中提供的颜色选择器组件，它的onChange事件会返回一个包含选中颜色信息的对象，我们通过setColor方法将选中颜色的hex值保存到color状态中。然后将该值作为style属性中的backgroundColor值，实现了背景颜色的关联。最后，点击保存按钮时可以将选中的颜色值发送到后端进行处理。