'How to customize dropdown item in react semantic-ui-react?
I'm using dropdown from semantic-ui-react.
I am dynamically creating a dropdown option, and I want to change the background color of the item dynamically.
How can I fill the background color to 100%?

Campaign
import {
Dropdown,
Menu,
} from "semantic-ui-react";
//make customize option
getCustomerGroupOptions = () => {
let options = [
{
text: "none",
key: "none",
value: {},
},
];
for (let tag of this.props.tags || []) {
options = [
...options,
{
text: tag.label,
key: tag.id,
value: tag,
content: (
<div
className="item"
style={{ backgroundColor: tag.color, color: "#fff" }}
>
{tag.label}
</div>
),
},
];
}
}
//Dropdown
<Dropdown
error={errors.recipientFlag}
placeholder={I18n.get(
`${scope}.normalModal.title3.group.placeholder`
)}
className="mb-5 width-75 max-width-350px"
name="recipient"
value={campaign.recipient ? campaign.recipient : null}
selection
options={groupOptions}
onChange={onChange}
/>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
