t.state = {};会改变 state，但是不能触发render t.setState({images:[]}); 是 array merge，并不是直接赋值state，并且是[异步](https://segmentfault.com/q/1010000003708852)的 render。然后计算虚拟DOM 再 决定是否改变DOM，或者说改变那些DOM，怎么操作DOM，这也是正确的改变state的方法，除此以外，任何对state进行改变的方式都是错误的，例如上面的方式。为了高效的操作DOM，所以必须采用一些手段，计算 react diff，虚拟DOM技术，这些都是为了提高DOM操作效率（越快，越少的操作），所以循环是的组件需要加一个key这也是为了更方便的计算DOM吧。 每次t.setState()都会执行 render() 相当于是服务端的$this->render()一样。  由于react的开发理念/方式和传统（jQuery）开发有很大的不同，所以有一些需要注意的问题。 还是以上面的例子为例，按照传统开发方式开发时，当有新的消息，我们需要操作DOM将新消息“插入”到消息列表，这个插入动作可以带点特效，让这个来了新消息的过程更加生动形象。其实在传统开发中这样的例子有很多，比如，发布，删除，这些操作，都可以带一些“动作”，以使操作表现得生动具体，也就是说很多时候我们不是简单的改变DOM，还会有一些为了描述当前操作的“动效（动作/效果）”的。这样能增强应用操作的体验。不然如果只是改变一下DOM，在浏览器上我们是看不到渲染过程的，只是看到页面内容生硬的改变了而已。 >[danger] 这种页面元素改变的方式显得很突兀，非常生硬，用户体验不友好。 当我们使用react时就会遇到这个问题，由于数据和DOM对应，我们并不需要关心DOM，有新消息时，react经过计算DOM different 找到最优的方式去操作DOM，所以新消息感觉是生硬的插入到文档中，我们只能感觉到突然多了一条消息，显然这种体验没有上面传统方式那样好了，感觉不到新消息“插入进来”的效果。并且如果当一个数据放生多次改变，但最终和最初数据相同，那么react就会得到数据没有变动，因而就不会有DOM操作了，比如让一个点移到右边后再移回来，由于setState是异步的，所以可能我们只会看到这个点待在原地并没有动，而是用传统方式就不会有这个问题，所以需要注意点，注意setState是怎么处罚渲染的。 所以当由传统开发转向react时需要注意可考虑这些问题。 但其实这些并不是问题，我们通过其他方式照样可以实现传统开发中的“动效”。 无论怎样，react还是极大的提高了我们的开发效率，这点是毋庸置疑的。 ### 临时笔记 state在钉钉项目中，使用路由时好像有缓存，如果不重置还会有缓存。我在想state这个东西到底是以一种什么形式存在的，全局？刷新就没有了，是否可以使用HTML5的缓存将它缓存起来呢？？？？？？ 2017-1-25 10:36:01 ### 扩展 [浅谈前端状态管理（上）](https://zhuanlan.zhihu.com/p/25800767) [React中使用CSSTransitionGroup插件实现轮播图 - 勤劳的小叶酱 - 博客园](http://www.cnblogs.com/diligentYe/p/6637585.html) [我的职业是前端工程师【九】：你应该知道的单页面应用的五要素](https://zhuanlan.zhihu.com/p/25858609) [从零开始手把手教你实现一个Virtual DOM](https://mp.weixin.qq.com/s/viBtv7KSD70qrlAhUMsjDA) [你真的理解setState吗？](https://mp.weixin.qq.com/s/_u_gqFe3t8lAAxiN724gpg) ---- update time: 2017-5-11 23:28:56