React+redux official instance Todo from the simplest introduction (4)--Change

The previous article achieved the "delete" function, then we continue to add the next function-"change"

The functionality of this modification is achieved by double-clicking each sub-option

Step one: Follow the rules to add a status statement

Step two: The action in the contract what we want to do, and the other elements (text) to reducer (here Eidttodo Modify the outer edittodo)

Step three: Reducer Central to update our store (believe it after comments about ... Grammar, Map loops and so on no longer need to write the comments, we can understand what is going on)

Fourth step: Of course, the way to write a concrete implementation of our sub-components

To here---change also realized, see is not very simple, decomposition steps!

Let's now add a border to the sub-components in the editing state! (if it is referred to by the head, then class is New-todo, if it is a content area reference, that is, edit, remember to add a custom attribute to the header Newtodo)

React+redux official instance Todo from the simplest introduction (4)--Change