score:1
After deleting the student you are dispatching the action and you are passing the action creator scrubStudent
to dispatch. You are passing id of the deleted student in that action creator. Now the way you have defined your action creator is like this
export function scrubStudent(student) {
return {
type: DELETE_STUDENT,
student
};
}
So the returned value of this function will be an object something like this
scrubStudent(5) // returns {type: "DELETE_STUDENT", student: 5}
But in your reducer you are comparing the ids like this
case DELETE_STUDENT:
// console.log("action.student", action.student);
// console.log("state", state);
newState = state.students.filter(function(student) {
return student.id !== action.id;
});
return newState;
In the above code action.id
is undefined. Instead student id is saved in as action.student
. So the comparison will return true for all the elements of array. So everytime all the elements will be included in the new state. So try to change your above code like this
case DELETE_STUDENT:
// console.log("action.student", action.student);
// console.log("state", state);
newState = state.students.filter(function(student) {
return student.id !== action.student;
});
return newState;
Source: stackoverflow.com
Related Query
- How do I get my view to update after an item was removed from my store/State in React with Redux
- How to get updated state from Redux store using redux-toolkit after component has already rendered?
- How to update an item in the state after the previous values of the state get updated?
- How to get something from the state / store inside a redux-saga function?
- How to update React UI from with state in Redux store with useEffect
- FileReader - how to update local state after store is updated?
- How to update the global state using redux and remove an item from the global state
- How to update the React State only after a return from API called is completed
- How do I get the state from useSelector after dispatch is done?
- How can I get state from selector after a page fresh?
- How can i get the new state from the mapped props after dispatching an action
- React JS (Form Update Not Working) - How to set state immediately after getting data from API using mapDispatchToProps?
- How can i get values from multiple input boxes on form submit and store the values as an object in an state array for React?
- How to instantly update react state after replacing the value from array
- How to get state data right after changing them from parent to child in React?
- How to store the data in React state after Querying it from GraphQL?
- How to update state of child component when it get called in map function from parent component React JS
- How to delete an item from state array?
- React get state from Redux store within useEffect
- How to update the Redux store after Apollo GraphQL query returns
- How to reset state of Redux Store when using configureStore from @reduxjs/toolkit?
- Javascript Redux - how to get an element from store by id
- How to update the state of a sibling component from another sibling or imported component in REACT
- redux get item from state or fetch from server
- React, how to access child's state from parent? no need to update parent's state
- How to get the changed state after an async action, using React functional hooks
- How to update state from other component?
- how and when to call a react component methods after state change from redux
- React Native, how to update view after language change
- How to update React component after changing state through redux?
More Query from same tag
- reactjs - How to provide properties to the component
- How do I convert my react js class component to a functional component?
- When printing website (react component), how to set width for react-bootstrap breakpoints for layout?
- How to change background color of a reusable component in ReactJS?
- Adjacent JSX elements must be wrapped in enclosing tag
- Building a docker image gives errors when NODE_ENV=production in use (Could not find a declaration file for module)
- useEffect clears, then refills my react hook
- How To Redirect To Another page in React js
- Array filter with more than one element
- ShouldComponentUpdate is never called in child components
- react component state changed only once
- Scrolling to a component on the same page using react-router
- Call function from React component in other component
- How to dynamically add isFixed if the items length is one in react-select?
- Can I pass extra props to a child component?
- Bootstrap 4 NavBar with React <Link/> component
- Search component in react using static contextTypes
- How to get Azure access token using client secret in MSAL?
- react creating generic input component
- How to get auto-generated ID of newly created document in a subcollection in Firestore Web V9? Javascript/React
- How to render components on the same page in react
- react useEffect strange behaviour - can't explain?
- How can I pass state to Tab render method in semantic ui react?
- Applying ID to canvas with react-three-renderer
- react js and existing Laravel project
- React-Redux: Where do I put a side effect that uses part of a reducer?
- i have the problem in i18next that the text not show from json data
- How to format the "createdAt" column created by MongoDB using moment?
- unable to access to an url using react-router-dom
- How to return all items from local storage?