修改ReactJS组件中子项的属性

Question

我试图弄清楚如何修改组件的子代，例如，添加一个类。我试过这样做：

var inputReactObject = React.Children.only(this.props.children);

inputReactObject.className = "test";

然而，这似乎不起作用。

是否可以在ReactJS组件中修改子属性？

Full plunker：http://plnkr.co/edit/msbUSDBQn17qXzBHzGXD?p=preview

Answer 1

如@lpiepiora plunker所述，执行我想要的代码将是：

var inputReactObject = React.Children.only(this.props.children);
var clonnedChild = React.addons.cloneWithProps(inputReactObject, {
  className: "input-element test"
});

return clonnedChild;

Answer 2

现在cloneWithProps是deprecated，目前的做法是

var inputReactObject = React.Children.only(this.props.children);
var clonedChild = React.cloneElement(inputReactObject, {
  className: "input-element test"
});

return clonedChild;