Topic: MDBSelect crashes when you remove the last item from the data list
clickstudioltd pro premium priority asked a year ago
When you remove the last item of the data list while there is more than 1 item in the list, MDBSelect
crashes.
Example:
import React, { useMemo, useState } from 'react';
import {
MDBSelect,
MDBContainer,
} from 'mdb-react-ui-kit';
import 'mdb-react-ui-kit/dist/css/mdb.min.css';
export default function App() {
const [selectedItems, setSelectedItems] = useState([]);
const items = useMemo(() => ([
{ text: 'Item 1', value: 'Item1' },
{ text: 'Item 2', value: 'Item2' },
{ text: 'Item 3', value: 'Item3' },
]), []);
const availableItems = useMemo(() => items.filter(item => !selectedItems.includes(item.value)), [items, selectedItems]);
return (
<MDBContainer className="p-3">
<MDBSelect
label="Items"
data={availableItems}
search
onChange={e => setSelectedItems([...selectedItems, e.value])}
/>
<div className="mt-3">
<div>Selected items:</div>
{selectedItems.map((item, index) => <div key={index}>{item}</div>)}
</div>
</MDBContainer>
);
}
If you select other items except the last one, it'll be fine but if you select the last item, you'll see it crash.
Mateusz Lazaru staff answered a year ago
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB React
- MDB Version: MDB5 7.1.0
- Device: PC
- Browser: Mozilla Firefox
- OS: Windows 10
- Provided sample code: No
- Provided link: No