react-live
react-live copied to clipboard
<select>'s onChange event doesn't include items that are selected.
I have this demo working fine in a normal react environment, but when I try it in react-live, it behaves differently.
Now when I try this code snippet in the react-live demo, it doesnt allow selecting items,
() => {
const selectBoxItems = [
{
label: "Reddit",
value: "reddit"
},
{
label: "Slack",
value: "slack"
},
{
label: "Twitter",
value: "twitter"
}
];
const [selected, setSelected] = React.useState([]);
return (
<select
multiple={true}
onChange={event => {
const selectedItems = [...event.target.options]
.filter(({ selected }) => selected)
.map(item => item.value);
setSelected(selectedItems);
}}
value={selected}
>
{selectBoxItems.map(option => (
<option key={option.value} value={option.value}>
{option.label}
</option>
))}
</select>
);
};
This was tested in Chrome.