Below is my State in Reactjs Functional Component
let valueByFilterInitState = [{ filterType: "Organization", value: "Micro", id: "15" }, { filterType: "Vehicle", value: "Bmw", id: "13" }]
const [filterListValue, setFilterListValue] = useState(valueByFilterInitState)
Here I am trying to filter the the list but it doesn't filter & returning the same array
const chipHandler = (list) => {
setFilterListValue(filterListValue => {
const copy = [...filterListValue]
let test = copy.filter((val) => {
if (val.value === list.value) {
return { filterType: val.filterType, value: "", id: "" }
}
return val
})
return test
})
}
Here I am rendering those filterListValue
<div style={{ display: "flex", justifyContent: "start", alignItems: "start", columnGap: 4 }}>
{
filterListValue.filter((selectedFilter) => selectedFilter.id !== "").map((list, index) => {
return (<Chip variant="outlined" label={list.value} onDelete={() => chipHandler(list, index)} />)
})
}
</div>