转换后更改ReactJS子组件（客户端）？

Question

使用ReactJS，您可以使用其他组件创建组件：

<MyComponent>
  <Calendar />
  <ProfilePic />
</MyComponent>

因此，在这种情况下，MyComponent有点像布局容器，在生成的HTML中有两个子组件按特定顺序排列。

如果MyComponent中的子组件的顺序需要在客户端更改，您会怎么做？在进行转换之前，这在服务器端相当容易，但是一旦将代码发送到浏览器，此时组件已经被转换为JS ...

您是否将子组件作为属性传递，只需定义它们的＆＃34;顺序＆＃34;它们也出现在属性的<MyComponent>布局中？例如，页面上的某些控件/窗口小部件可能会改变子组件的顺序，因此<ProfilePic>现在位于HTML中的<Calendar>之前。

解决此问题的最佳方法是什么？

Answer 1

是的你可以这样做，你必须做一些代码更改，就像你必须创建一个CustomeComponent，它可以在运行时决定应该在运行时加载哪个组件，就像你的CustomeComponent看起来像

var Custome=React.createClass({

var InputComponentName=this.props.input;

render:function(){

return(
  <InputComponentName />
 )
}
});

现在从父组件你必须像

一样调用组件

<MyComponent>
 <Custome input="Calender" />
</MyComponent>

在上面提到的代码中，您可以像序列号那样执行逻辑，并根据它将呈现的序列。