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...