I am working on the reducer file which looks like this:
export default (state = [], action) => {
let index
switch (action.type){
case "ADD_QUOTE":
return [...state,action.quote]
case "REMOVE_QUOTE":
return state.filter(q=>q.id !==action.quoteId)
case "UPVOTE_QUOTE":
index = state.findIndex(quote => quote.id === action.quoteId);
let quote = state[index];
return [
...state.slice(0, index),
Object.assign({}, quote, { votes: quote.votes += 1 }),
...state.slice(index + 1)
];
default:
return state
}
}
I have two ways to implement case UPVOTE_QUOTE, the first one is in the above code, and the second one looks like this:
...
case "UPVOTE_QUOTE":
let quote = state.find(q=>q.id===action.quoteId)
quote.votes +=1
return state
...
I wonder what is the difference. And in the second situation, what I am not sure is, if I change the votes property in that one quote element in state, when I return the state, will it be the state with the new quote? And is this state the original state or a new state that refers to a new place? Very confused...