I am seeing this behaviour where if i copy a redux state to a local variable and make a change to that variable it also updates my redux store without me using any kind of dispatching, here is my code:
// here is my action type inside my reducer
case SET_USERS:
return {
...state,
users: action.payload,
};
// and here i have a helper function to select a specific state and pass it to useSelector later on
export const getUsersSelector = (state: RootState) => {
return state.app.users;
};
and i am accessing my state like this inside a custom hook useUsers
i have
export const useUsers = () => {
const users = useSelector(getUsersSelector);
return {users}
}
and i am accessing my users
value in another component using the useUsers
hook:
const ListUsers = () => {
const {users} = useUsers()
//i make a copy of my users state
const copyOfUsers = users
//and update the copied variable
copyOfUsers.push({name: 'John'})
retunr (<View>{copyOfUsers.map((user)=><Text>{user.name}</Text>)}</View>)
}
the issue i am having is pushing a new item to my copyOfUsers
variable also updates the users
state inside the redux store, i dont know why this is happening and if its a normal behaviour, just wanted to know if this is a bug or intentional behaviour of redux? or how i can avoid it?