上一篇文章实现了《删》这个功能,那么我们继续添加下一功能--《改》

这个修改的功能是通过双击每个子选项实现

第一步:按规矩来,添加一个状态声明

第二步:action中约定我们要干什么,并且将其他元素(text)传给reducer(这里eidtTodo修改外editTodo)

第三步:reducer中区更新我们的store(相信经过注释关于...语法,map循环等不用再写注释了,大家也能明白怎么回事了)

第四步:当然是去我们的子组件编写具体实现的方法了

到了这里---改也实现了,看是不是很简单,分解步骤!

我们现在给处于编辑状态的子组件加一个边框吧!(如果是头部引用的它,那么class就是new-todo,如果是内容区域引用的话,就是edit,记住给Header添加一个自定义属性newTodo)

效果图

react+redux官方实例TODO从最简单的入门(4)-- 改的更多相关文章

  1. react+redux官方实例TODO从最简单的入门(6)-- 完结

    通过实现了增-->删-->改-->查,对react结合redux的机制差不多已经了解,那么把剩下的功能一起完成吧 全选 1.声明状态,这个是全选状态 2.action约定 3.red ...

  2. react+redux官方实例TODO从最简单的入门(1)-- 前言

    刚进公司的时候,一点react不会,有一个需求要改,重构页面!!!完全懵逼,一点不知道怎么办!然后就去官方文档,花了一周时间,就纯react实现了页面重构,总体来说,react还是比较简单的,由于当初 ...

  3. react+redux官方实例TODO从最简单的入门(5)-- 查

    上一篇文章<改>实现了,最后一个功能--<查>! 这个查是稍微要复杂一点的功能,官方实现的就是一个过滤数组的效果,然后展示出来,这里有3个状态,all,completed,ac ...

  4. react+redux官方实例TODO从最简单的入门(2)-- 增

    虽然官网的TodoList的例子写的很详细,但是都是一步到位,就是给你一个action,好家伙,全部都写好了,给你一个reducer,所有功能也是都写好了,但是我们这些小白怎么可能一下就消化那么多,那 ...

  5. react+redux官方实例TODO从最简单的入门(3)-- 删

    上一篇文章我们实现了增删改查中<增>这个功能 那么这一篇我们将实现第二个功能,删! 首先增加一个状态: actions中增加对应的约定 到reducer里面设置执行的函数(这里todo.i ...

  6. 超具体Windows版本号编译执行React Native官方实例UIExplorer项目(多图慎入)

    ),React Native技术交流4群(458982758).请不要反复加群! 欢迎各位大牛,React Native技术爱好者加入交流!同一时候博客右側欢迎微信扫描关注订阅号,移动技术干货,精彩文 ...

  7. 基于React,Redux以及wilddog的聊天室简单实现

    本文主要是使用ReactJs和Redux来实现一个聊天功能的页面,页面极其简单.使用React时间不长,还是个noob,有不对之处欢迎大家吐槽指正. 还要指出这里没有使用到websocket等技术来实 ...

  8. 用react+redux写一个todo

    概述 最近学习redux,打算用redux写了一个todo.记录下来,供以后开发时参考,相信对其他人也有用. 代码 代码请见我的github 组织架构如下图:

  9. 实例讲解基于 React+Redux 的前端开发流程

    原文地址:https://segmentfault.com/a/1190000005356568 前言:在当下的前端界,react 和 redux 发展得如火如荼,react 在 github 的 s ...

随机推荐

  1. 索引超出了数组界限(Microsoft.SqlServer.Smo)

    SSMS连接远程SQL Server服务器是很方便的. 昨天我用SQL Server 2008 SSMS连接SQL Server 2012竟然报错,如下图: 在网上搜了,参考这个参考那个,太啰嗦了,确 ...

  2. 解读ASP.NET 5 & MVC6系列(12):基于Lamda表达式的强类型Routing实现

    前面的深入理解Routing章节,我们讲到了在MVC中,除了使用默认的ASP.NET 5的路由注册方式,还可以使用基于Attribute的特性(Route和HttpXXX系列方法)来定义.本章,我们将 ...

  3. 我们都是IT民工---------流浪人IDE开发札记

    你生命中的有些东西终究会失去,比如我住了6年的陈寨,这个聚集了郑州十几万IT民工的地方,说拆就拆了.再比如我玩了3年的坦克英雄,这个带给我太多快乐的游戏,说停就停了. 编程对我而言是种爱好,我上学6年 ...

  4. [网站公告]数据库服务器IOPS跑满造成网站不能正常访问

    今年下午13:20-14:20左右,突增的访问量引发数据库服务器(阿里云RDS)IOPS跑满,造成大量请求执行缓慢,从而严重影响了网站的正常访问,给大家带来很大的麻烦,望大家谅解! 在出现故障时,当我 ...

  5. 使用markdown

    一.在windows下使用markdown MarkdownPad:MarkdownPad is a full-featured markdown editor for windows. Awsomi ...

  6. poj3581

    Sequence Time Limit: 5000MS   Memory Limit: 65536K Total Submissions: 6893   Accepted: 1534 Case Tim ...

  7. Servlet学习笔记

    在这里记录最重要的要点 1,tomcat-->conf-->server.xml里面的东西是什么?(tomcat怎么知道“谁”去处理客户端来的请求?) 最主要的是一个依赖的控制,换句话说什 ...

  8. SSH(Struts2+Spring4+HIbernate5)的简化

    今天给大家带来的是一个简单的新闻发布系统 首先在学习过程中我是深有体会,做事情不要浮躁,不要想着一口吃下一个胖子, 最最重要的是理解,理解透了学什么东西都是随心所欲的. 开发环境:win10系统 jd ...

  9. 分享一种容易理解的js去重排序方法

    <script> var arr=[1,8,6,4,88,22,99,4,6,86,5,58,89,5]; //先使用sort()函数去重 var a=arr.sort(function ...

  10. time step和采样频率的关系

    当前的采样频率为11025HZ,overlap=0.5,取的是1024个采样点为1帧.则time step为256时的时间长度为11秒.即以11秒为单位分割原始的音频,生成一张语普图. >> ...