score:3
Accepted answer
// Define this somewhere
const INITIAL_STATE = {
"some_id1": [
{
"id": 93979
},
{
"id": 93978
}
],
"some_id2": [
{
"id": 93961
},
{
"id": 93960
}
]
};
// State initialization
const [items, setItems] = React.useState(INITIAL_STATE);
// Handler to remove the nested object with matching `id`
const removeByNestedId = (id, items) => {
const keys = Object.keys(items);
const updatedItems = keys.reduce((result, key) => {
const values = items[key];
// Since, we want to remove the object with matching id, we filter out the ones for which the id did not match. This way, the new values will not include the object with id as `id` argument passed.
result[key] = values.filter(nestedItem => nestedItem.id !== id)
return result;
}, {});
setItems(updatedItems);
}
// Usage
removeByNestedId(93961, items);
score:0
const items = {
"some_id1": [
{
"id": 93979,
},
{
"id": 93978,
}
],
"some_id2": [
{
"id": 93961,
},
{
"id": 93960,
}
]
}
const singleItemId = 93979;
for (const k in items) items[k] = items[k].filter(x => x.id !== singleItemId);
console.log(items);
//setItems(items)
score:0
setData(d=>d.filter(item=>item.id !== id));
score:1
const data = {"some_id1": [{"id": 93979},{"id": 93978}],"some_id2": [{"id": 93961},{"id": 93960}]}
const remove = ({id, data}) => {
return Object.entries(data).reduce((prev, [nextKey, nextValue]) => {
return {...prev, [nextKey]: nextValue.filter(({id: itemId}) => id !== itemId)}
}, {})
}
console.log(remove({id: 93961, data}))
Source: stackoverflow.com
Related Query
- updating object inside array inside object using prevState and the useState hook
- useState hook can only set one object at the time and return the other object of the same array to initial state
- update the array of object using useState hook
- how do i update state in react for updating the value of an object inside an array using array.map function
- Updating and merging state object using React useState() hook
- Updating the array object in React state using immutability helper
- Do I need to use the spread operator when using useState hook on object when updating?
- Adding a key-value pair to an object inside loop using React useState hook
- How do I correctly add data from multiple endpoints called inside useEffect to the state object using React Hooks and Context API?
- Get object array from axios and using return value call another axios function and append the output to first result
- How to manage the asynchrounous nature of useState hook when setting a value and using it directly after
- updating a useState to the value that it's already holding inside of a custom React hook causes infinite re-render
- How to check if the array of object is null using react and javascript?
- Updating just part of state and keeping others same when using useState hook
- How to find the count of some object property in array of objects using react and javascript?
- How to define TypeScript types when used with React useState and the previous state inside a state updating function?
- React hook using useEffect with an array inside the dependencies array
- My useState hook is not updating itself and when i am trying to get data using filter, its not working
- How can I get all the object inside an object which is present inside an array and add the result into another array
- How to count object property occurrence in an array by adding count property to the object properties and updating each occurrence of count?
- Why the state is still showing Promise while using redux? and how should I access the array inside the result?
- useState set method inside useEffect hook not updating till refreching the page
- react-native textInput inside flatlist using array of object with useState, always rerender when type something the keyboard goes down
- modify and insert new object in array of objects with useState hook
- React - Updating previous array with new values using useState hook
- Append a item to an array that is inside a object with useState Hook
- Updating an object inside array using this.setState
- How do I increment the count of a selected index of state object using setState method given by useState hook in my react application
- how to add and remove number without duplicate in the state object inside the array in Reactjs?
- Change the value of all the fields in an object using useState hook
More Query from same tag
- react-select: how to keep dropdown open when styling in inspector?
- Material UI Slide component - how to disable Slide Effect based on component state
- React + Redux - Why not connect all the components?
- How do I return a callback from react hooks back the parent component? like returning the list of uploaded url
- Trying to display search history with react and the Reddit API
- Accessing Passport's req.user within React (ES6)? API call returns req.user as undefined
- How to use yarn to create a React app project?
- Why does my filter not work when i add intergers?
- react.js and transmission parameter props in recursion
- convert the circle border onto clickable function
- How do I set the default value of a <select> element in React?
- Reactjs useState hook not updating on promise data
- Trying for pagination using reactQuery
- Are the OnMouseEnter and OnMouseLeave called asynchronously when exiting an item and entering another?
- How to start React project with HTTPS
- Stacked divs resizing each other
- React not mapping certain objects in an array
- react-admin add font with override MuiCssBaseline @global @font-face not working
- Why doesn't react.component function definition contain a reference to .state property?
- Typescript implement conditional props
- show confirmation dialog using redux-observable
- Retrieving the key for the entry from material-ui autocomplete at onSelect, instead of value
- ReactJS + Material-UI: How to use Material-UI’s FlatButton and Dialog in each TableRow?
- How do I check for an element with a certain class?
- Calling setState without triggering re-render
- How to hide the input text after 5 milliseconds in React?
- Correctly bundled image could not be loaded
- why TODO list is not working properly in reactjs
- How to add Spacing in between icons but they remain in the same row with minimalistic code with out adding styles.js or anything like that
- Play/Pause video onScroll in Reactjs