{"action":"opened","issue":{"url":"https://api.github.com/repos/facebook/react/issues/5544","labels_url":"https://api.github.com/repos/facebook/react/issues/5544/labels{/name}","comments_url":"https://api.github.com/repos/facebook/react/issues/5544/comments","events_url":"https://api.github.com/repos/facebook/react/issues/5544/events","html_url":"https://github.com/facebook/react/issues/5544","id":118796562,"number":5544,"title":"Does the change of the state always fire the function \"render\"?","user":{"login":"rubyisapm","id":5107016,"avatar_url":"https://avatars.githubusercontent.com/u/5107016?v=3","gravatar_id":"","url":"https://api.github.com/users/rubyisapm","html_url":"https://github.com/rubyisapm","followers_url":"https://api.github.com/users/rubyisapm/followers","following_url":"https://api.github.com/users/rubyisapm/following{/other_user}","gists_url":"https://api.github.com/users/rubyisapm/gists{/gist_id}","starred_url":"https://api.github.com/users/rubyisapm/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/rubyisapm/subscriptions","organizations_url":"https://api.github.com/users/rubyisapm/orgs","repos_url":"https://api.github.com/users/rubyisapm/repos","events_url":"https://api.github.com/users/rubyisapm/events{/privacy}","received_events_url":"https://api.github.com/users/rubyisapm/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":0,"created_at":"2015-11-25T09:40:37Z","updated_at":"2015-11-25T09:40:37Z","closed_at":null,"body":"Here is the example:\r\n```\r\n'use strict';\r\nimport React from 'react';\r\nexport var componentA=React.createClass({\r\n  componentWillMount(){\r\n    this.setState({\r\n      appList:this.props.appList,\r\n      c:this.props.c\r\n    })\r\n  },\r\n  componentWillReceiveProps(newProps){\r\n    this.setState({\r\n      appList:newProps.appList,\r\n      c:newProps.c\r\n    })\r\n  },\r\n  render(){\r\n    console.log(this.state);\r\n    return (\r\n      <ul>\r\n        {this.state.appList.map(function(object,i){\r\n          return <li>\r\n            <input type=\"text\" defaultValue={object} ref={'input'+i}/>\r\n          </li>\r\n        })}\r\n        <li>{this.state.c}</li>\r\n      </ul>\r\n    );\r\n  },\r\n  componentDidUpdate(){\r\n    console.log(this.refs)\r\n    console.log(this.refs.input1.value);\r\n  }\r\n})\r\n```\r\n\r\nI use it on page A:\r\n```\r\nvar appList=[12,4,5,6,7];\r\n      var c=12;\r\n      React.render(<ComponentA appList={appList} c={c}/>,$('#containerA')[0]);\r\n\r\n      setTimeout(function(){\r\n        var appList=[3,4,5,3];\r\n        var d=20;\r\n        React.render(<ComponentA appList={appList} c={d}/>,$('#containerA')[0]);\r\n      },2000);\r\n```\r\n\r\nbut after the second update, I found that the values of the inputs can't change according to the state that I pass in the second time. \r\n\r\nI also want to know, if there are some UI operation happened during two calls for the render, is it possible that React can reserve those for users? or just refresh the whole component according the state?\r\n"}}