我想创建一个可以使用 React.js 呈现的灵活/动态JSX 表单格式。此格式必须包含嵌套组。一个组可以包含其他组以及问题。
var Group = React.createClass({
render: function(){
return (
<fieldset></fieldset>
);
}
});
var Text = React.createClass({
render: function() {
return (
<label>
<input type="text"/>
</label>
);
}
});
React.render(
<form>
<Group>
<Text/>
</Group>
<Text/>
</form>,
document.getElementById('container')
);
我想生产:
<form>
<fieldset>
<label>
<input type="text">
</label>
</fieldset>
<label>
<input type="text">
</label>
</form>
但是,该<fieldset>
元素未填充。输出只包含一个空的<fieldset>
.
我应该如何嵌套 react.js 组件,并仍然保持在根和嵌套级别重用问题和组组件的灵活性?