假设 你的key设置为map中的索引，假设为0，1，2（原dom树），现在你用splice删除掉1，重新渲染时，还是会按map索引按顺序渲染为0，1（新dom树），由于react渲染机制是比较的key值，发现key（0，1）都没变，所以保留原dom树的0，1元素（包括里面内容都不变），而由于数量少了一个，渲染的最后一个就没有渲染，就感觉是删除的最后一个。

react使用map生成的元素，key的设定不对导致每次删除都删除最后一个的更多相关文章

  1. 【原】React中,map出来的元素添加事件无法使用

    在使用react中,经常用到react的map函数,用法和jquery里中的map一样,但是,如果你在每个map出来的元素中添加,你会发觉添加的事件无法关联, 比如,我们很多的评论,我需要在每个评论下 ...

  2. 关于React中,map出来的元素添加事件问题

    用es6 map 的写法 直接绑定一个onTouchStart 事件不会报错. 用es5的map写法  如果不加上this  会报这个错误 无法读取未定义的属性 解决的方法是 绑定this  就可以了

  3. React map生成元素添加点击事件绑定this

    问题 使用.map(function(Item)生成元素添加onClick事件:onClick={this.provinceChange.bind(this, "99")}时,前台 ...

  4. Map四种获取key和value值的方法，以及对map中的元素排序（转）

    获取map的值主要有四种方法,这四种方法又分为两类,一类是调用map.keySet()方法来获取key和value的值,另一类则是通过map.entrySet()方法来取值,两者的区别在于,前者主要是 ...

  5. react.js map遍历的问题

    React遍历多个Ant Design中的Upload组件时,随意删除任一个Upload出现了bug,依次点击上传图片后,当点击删除时,倒着删除没有问题,从中间和从开头删问题出现了,出现了类似塌方的效 ...

  6. vue 项目， 通知子组件更新，父组件中每次点击按钮重新加载子组件，（重新生成dom 元素）

    vue是组件化开发的项目,很多情况下会把公共组件提取出来,来减少代码量,提高开发效率,和以后更好的可维护性.很多情况下,父组件中都会引用子组件这种情况.通过给在父组件中引用的子组件标签上添加属性,来渲 ...

  7. React源码解析之React.Children.map()(五)

    一,React.Children是什么? 是为了处理this.props.children(this.props.children表示所有组件的子节点)这个属性提供的工具,是顶层的api之一 二,Re ...

  8. foreach属性-动态-mybatis中使用map类型参数，其中key为列名，value为列值

    http://zhangxiong0301.iteye.com/blog/2242723 最近有个需求,就是使用mybatis时,向mysql中插入数据,其参数为map类型,map里面的key为列名, ...

  9. vector、map 判断某元素是否存在、查找指定元素

    一.vector 1.判断某元素是否存在 vector<string> vStr; int nRet = std::count(vStr.begin(), vStr.end(), &quo ...

随机推荐

  1. 对C# 构造函数的理解

    C#构造函数是在创建给定类型的对象时执行的类方法. 构造函数具有与类相同的名称,它通常初始化新对象的数据成员.不带参数的构造函数称为“默认构造函数”. 无论何时,只要使用 new 运算符实例化对象,并 ...

  2. convert.c:7:3: warning: incompatible implicit declaration of built-in function ‘printf’ [enabled by

    产生这样的问题主要是因为你使用了某一个函数,却没有引入相应的头文件.这与java中其实是一样的. 例如:在java中,使用某一个工具类,就要导入相应的包.

  3. Android消息推送之GCM方式（一）

    <声明> 转载请保留本来源地址: http://blog.csdn.net/wzg_1987/article/details/9140371 首先,你需要使用一个谷歌账号登录谷歌Api控制 ...

  4. 内核操作系统Linux内核变迁杂谈——感知市场的力量

    本篇文章个人在青岛游玩的时候突然想到的...今天就有想写几篇关于内核操作系统的博客,所以回家到以后就奋笔疾书的写出来发表了 Jack:什么是操作系统? 我:你买了一台笔记本,然后把整块硬盘彻底格式化, ...

  5. phper談談最近重構代碼的感受(2)

    重构代码更多的是对程序的可读性和可扩展性上做一些优化. 首先我对可读性进行细化.借鉴大神川山甲的重构系列文http://www.cnblogs.com/baochuan/archive/2012/03 ...

  6. Linux文件系统十问，你知道吗？

    关于文件系统,相信大家都不陌生.身为攻城狮的我们几乎天天都会与之打交道,但是细深剖一下,其中又有多少是我们理解深度不够的呢.那么让我们一起来看一下下面这一组Linux文件系统相关的问题吧: 1.机械磁 ...

  7. nginx错误：unknown directive "锘? in F:\nginx/conf/nginx.conf:3

    C:\Users\Administrator>d: D:\>cd D:\nginx-1.4.7 D:\nginx-1.4.7>start nginx.exe D:\nginx-1.4 ...

  8. Python自学笔记——Matplotlib风羽自定义

    [前言]对于气象专业的小学生来说,风场是预报重要的参考数据,我们所知的风羽有四种:短线代表风速2m/s,长线代表风速4m/s,空心三角代表风速20m/s,实心三角代表风速50m/s.而matplotl ...

  9. 《linux内核完全剖析》笔记03-进程创建

    根据一下问题来看笔记 进程占多大的线形地址空间 进程实际分配多少物理内存 创建进程的开销在哪里 一. 从fork系统调用开始 kernel/sys_call.s第222行 _sys_fork: cal ...

  10. C语言之while和do-while

    一 while和do-while的简介 1). while语句 语法: while(表达式){ 循环体; } 循环过程: 1.先判断表达式,是否为真,如果为真跳转到2,否则跳转到3 2.执行循环体,执 ...