react+redux官方实例TODO从最简单的入门(4)-- 改
上一篇文章实现了《删》这个功能,那么我们继续添加下一功能--《改》
这个修改的功能是通过双击每个子选项实现
第一步:按规矩来,添加一个状态声明

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

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

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


到了这里---改也实现了,看是不是很简单,分解步骤!
我们现在给处于编辑状态的子组件加一个边框吧!(如果是头部引用的它,那么class就是new-todo,如果是内容区域引用的话,就是edit,记住给Header添加一个自定义属性newTodo)

效果图

react+redux官方实例TODO从最简单的入门(4)-- 改的更多相关文章
- react+redux官方实例TODO从最简单的入门(6)-- 完结
通过实现了增-->删-->改-->查,对react结合redux的机制差不多已经了解,那么把剩下的功能一起完成吧 全选 1.声明状态,这个是全选状态 2.action约定 3.red ...
- react+redux官方实例TODO从最简单的入门(1)-- 前言
刚进公司的时候,一点react不会,有一个需求要改,重构页面!!!完全懵逼,一点不知道怎么办!然后就去官方文档,花了一周时间,就纯react实现了页面重构,总体来说,react还是比较简单的,由于当初 ...
- react+redux官方实例TODO从最简单的入门(5)-- 查
上一篇文章<改>实现了,最后一个功能--<查>! 这个查是稍微要复杂一点的功能,官方实现的就是一个过滤数组的效果,然后展示出来,这里有3个状态,all,completed,ac ...
- react+redux官方实例TODO从最简单的入门(2)-- 增
虽然官网的TodoList的例子写的很详细,但是都是一步到位,就是给你一个action,好家伙,全部都写好了,给你一个reducer,所有功能也是都写好了,但是我们这些小白怎么可能一下就消化那么多,那 ...
- react+redux官方实例TODO从最简单的入门(3)-- 删
上一篇文章我们实现了增删改查中<增>这个功能 那么这一篇我们将实现第二个功能,删! 首先增加一个状态: actions中增加对应的约定 到reducer里面设置执行的函数(这里todo.i ...
- 超具体Windows版本号编译执行React Native官方实例UIExplorer项目(多图慎入)
),React Native技术交流4群(458982758).请不要反复加群! 欢迎各位大牛,React Native技术爱好者加入交流!同一时候博客右側欢迎微信扫描关注订阅号,移动技术干货,精彩文 ...
- 基于React,Redux以及wilddog的聊天室简单实现
本文主要是使用ReactJs和Redux来实现一个聊天功能的页面,页面极其简单.使用React时间不长,还是个noob,有不对之处欢迎大家吐槽指正. 还要指出这里没有使用到websocket等技术来实 ...
- 用react+redux写一个todo
概述 最近学习redux,打算用redux写了一个todo.记录下来,供以后开发时参考,相信对其他人也有用. 代码 代码请见我的github 组织架构如下图:
- 实例讲解基于 React+Redux 的前端开发流程
原文地址:https://segmentfault.com/a/1190000005356568 前言:在当下的前端界,react 和 redux 发展得如火如荼,react 在 github 的 s ...
随机推荐
- dubbo/dubbox 增加原生thrift及avro支持
(facebook) thrift / (hadoop) avro / (google) probuf(grpc)是近几年来比较抢眼的高效序列化/rpc框架,dubbo框架虽然有thrift的支持,但 ...
- [LeetCode] Super Pow 超级次方
Your task is to calculate ab mod 1337 where a is a positive integer and b is an extremely large posi ...
- [LeetCode] Binary Tree Longest Consecutive Sequence 二叉树最长连续序列
Given a binary tree, find the length of the longest consecutive sequence path. The path refers to an ...
- mysqld初探
一.简介 deamon是守护神的意思,表示守护进程.mysqld就是mysql的服务器端,就是基于socket的一个服务器端程序,它始终监听3306端口(默认端口).mysql是客户端程序. 安装my ...
- weui 图片弹框
添加图片与弹出效果对比: HTML: <!DOCTYPE html> <html> <head> <meta charset="UTF-8" ...
- 怎么用XMind辅助电商工作
随着电商的迅猛发展,突出了电商运营管理的重要性.能不能做好电商,就要看他的管理做的好不好,全面不全面!电商的突破与进步,离不开全方位的协同管理.之前,小编有给大家介绍过电商量化管理的四大利器:XMin ...
- FREEBSD手工配置网络
在FreeBSD系统中,网络能力十分重要,对于一个标准的FreeBSD系统,至少要有一个网络界面以便与其他计算机通信.最常见的网络界面为以太网卡.此外FreeBSD也支持Token Ring和FDDI ...
- 【20161203-20161208】清华集训2016滚粗记&&酱油记&&游记
先挖坑(这个blog怎么变成游记专用了--) 已更完 #include <cstdio> using namespace std; int main(){ puts("转载请注明 ...
- Javascript格式化json返回的时间(/Date(1482747413000)/)
//时间处理,类似/Date(1482747413000)/的形式,得到xxx年xx月xx日 11:11:11 function ChangeDateFormat(jsondate) { jsonda ...
- VirtualBox安装MS-DOS6.22(图文教程)
最近在读一些计算机发展史之类的文献,总感觉的纸上得来终觉浅,所以打算自己装一个MS-DOS,体验一下远古的操作系统!可以google到MS-DOS的安装文件: 为什么要分成三个呢?可以看到,每个大小都 ...