假设 你的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. 博客已迁移到lizhug.com

    新的博客地址 http://lizhug.com

  2. linux memory release commands内存清理/释放命令

    linux 内存清理/释放命令 You could find reference from here: http://jingyan.baidu.com/article/597a06436a687f3 ...

  3. [转]Python tips: 什么是*args和**kwargs?

    Python tips: 什么是*args和**kwargs? 原文地址:http://www.cnblogs.com/fengmk2/archive/2008/04/21/1163766.html ...

  4. Spring.Net-创建对象

    1:通过构造函数创建对象    在配置文件中,指明对象类型<object id="" type="类型全名,程序集名" />    在代码中指定对象 ...

  5. day7 面向对象编程

    编程范式 编程是程序员用特定的语法+数据结构+算法组成的代码来告诉计算机如何执行任务的过程,一个程序是程序员为了得到一个任务结果而编写的一组指令的集合,正所谓条条大路通罗马,实现一个任务的方式有很多种 ...

  6. jquery实现调用webservice

    1.webservice端 using System; using System.Collections.Generic; using System.Web; using System.Web.Ser ...

  7. cocos2d(x) HTML label ;CCHTML CCHTMLLabel

    这几天由于特殊需要,写了一个HTMLLabel.可以直接支持HTML的几种格式,<font> <a href> color size 等等. 参考object C的一个ios开 ...

  8. 如何制作一个类似Tiny Wings的游戏 Cocos2d-x 2.1.4

    在第一篇<如何使用CCRenderTexture创建动态纹理>基础上,增加创建动态山丘,原文<How To Create A Game Like Tiny Wings with Co ...

  9. 通告机制Notification

    Obj-c的基本通讯原则是对象间的消息传递,这种情况多出现在两个对象之间.但是如果多个对象共同关注一个对象状态的时候呢,当然可以让发生事件的对象向所有关注他的对象发送消息,但是这并不高效.所以有了通告 ...

  10. function返回值Python特殊语法:filter、map、reduce、lambda

    废话就不多说了,开始... Python内置了一些非常有趣但非常有用的函数,充分体现了Python的语言魅力! filter(function, sequence):对sequence中的item顺次 ...