ReactJS - prevent re-removal of children

Question

I have a parent component of React with 3 children, for example:

var Parent = React.createClass({
   render: function() {
     return (<div>
         <C1/>
         <C2/>
         <C3/>
       </div>)
   }
})

I am trying to change the position of children based on the current state of the parent. Therefore, in different cases, I need to return C1, C3, C2 or C3, C2, C1 , etc. But I want this without re-treating the children. I am trying to use mustComponentUpdate for each of the children, but it is called for components that do not change their position in the parent rendering method. Therefore, if C1, C2, C3 is initially returned , then C2, C1, C3 , then it should contain ComponentUpdate for C3 , but not for C1 or C2so in this case I can return false inside C3 and prevent re-rendering, but I don’t understand why shouldComponentUpdate is not called for children who did change their position.

Any suggestions? thank.

Answer 1

Take a look at http://facebook.imtqy.com/react/docs/create-fragment.html .
Key fragments were designed to solve such a problem :)