1
0
mirror of https://github.com/ascribe/onion.git synced 2025-01-03 10:25:08 +01:00

Small cleanup for renderChildren()

This commit is contained in:
Brett Sun 2016-02-12 11:15:56 +01:00
parent 65f7d02e6d
commit 34f3bdcc4e
2 changed files with 21 additions and 15 deletions

View File

@ -250,12 +250,15 @@ let Form = React.createClass({
}, },
renderChildren() { renderChildren() {
return ReactAddons.Children.map(this.props.children, (child, i) => { const { children, disabled } = this.props;
return ReactAddons.Children.map(children, (child, i) => {
if (child) { if (child) {
return React.cloneElement(child, { return React.cloneElement(child, {
handleChange: this.handleChangeChild,
ref: (ref) => { ref: (ref) => {
this._refs[child.props.name] = ref; if (child.props.name) {
this._refs[child.props.name] = ref;
}
// Since refs will be overwritten by this functions return statement, // Since refs will be overwritten by this functions return statement,
// we still want to be able to define refs for nested `Form` or `Property` // we still want to be able to define refs for nested `Form` or `Property`
@ -265,10 +268,11 @@ let Form = React.createClass({
child.ref(ref); child.ref(ref);
} }
}, },
key: i,
// We need this in order to make editable be overridable when setting it directly // We need this in order to make editable be overridable when setting it directly
// on Property // on Property
editable: child.props.overrideForm ? child.props.editable : !this.props.disabled editable: child.props.overrideForm ? child.props.editable : !disabled,
handleChange: this.handleChangeChild,
key: i
}); });
} }
}); });

View File

@ -263,17 +263,13 @@ const Property = React.createClass({
}, },
renderChildren(style) { renderChildren(style) {
const { checkboxLabel, children, editable, name } = this.props;
// Input's props should only be cloned and propagated down the tree, // Input's props should only be cloned and propagated down the tree,
// if the component is actually being shown (!== 'expanded === false') // if the component is actually being shown (!== 'expanded === false')
if((this.state.expanded && this.props.checkboxLabel) || !this.props.checkboxLabel) { if ((this.state.expanded && checkboxLabel) || !checkboxLabel) {
return ReactAddons.Children.map(this.props.children, (child) => { return ReactAddons.Children.map(children, (child) => {
const childWithProps = React.cloneElement(child, { const childWithProps = React.cloneElement(child, {
style,
onChange: this.handleChange,
onFocus: this.handleFocus,
onBlur: this.handleBlur,
setWarning: this.setWarning,
disabled: !this.props.editable,
ref: (ref) => { ref: (ref) => {
this._refs.input = ref; this._refs.input = ref;
@ -285,8 +281,14 @@ const Property = React.createClass({
child.ref(ref); child.ref(ref);
} }
}, },
name: this.props.name, name,
setExpanded: this.setExpanded style,
disabled: !editable,
onBlur: this.handleBlur,
onChange: this.handleChange,
onFocus: this.handleFocus,
setExpanded: this.setExpanded,
setWarning: this.setWarning
}); });
return childWithProps; return childWithProps;