Recently, I implemented a feature where chips are generated as the user types in a text field and clicks on create. A chip is then displayed with the entered text. Now, I am looking to add the ability to delete these chips dynamically. You can view the sandbox example here. Specifically, I need guidance on what actions should be performed within my handleDelete function.
import React from "react";
// Other imports here
export default function OutlinedChips() {
// State declarations and event handlers here
const handleDelete = () => {
console.log(hashtag);
};
// Other functions for handling hashtags
const Hashtags = arrayOfHashtags.map(h => (
<Chip
size="small"
avatar={<Avatar>#</Avatar>}
label={h}
onDelete={handleDelete}
/>
));
return (
<div>
// JSX elements for input, button, and displaying hashtags here
</div>
);
}