> 0.5%, last 2 versions, Firefox ESR, not dead
onChangePicture = e =>
this.setState(
{ data: { ...this.state.data, [e.target.name]: e.target.files[0] } },
this.onSubmit
);
onSubmit = e => {
if (e) e.preventDefault();
const errors = this.validate(this.state.data);
this.setState({ errors });
if (Object.keys(errors).length === 0) {
this.setState({ loading: true });
this.props.submit(this.state.data);
}
};
class Parent extends React.Component {
state = {
inputFoo: '',
inputBaz: ''
};
handleChangeInput = (inputName, value) => {
this.setState({
[inputName]: value
})
}
render() {
const { inputFoo, inputBaz } = this.state;
return (
<div>
<Children1
inputFoo={inputFoo}
inputBaz={inputBaz}
onChangeInput={this.handleChangeInput}
/>
<Children2
inputFoo={inputFoo}
inputBaz={inputBaz}
/>
</div>
);
}
}
class Chidlren1 extends React.Component {
handleInputChange = event => {
const {name, value} = event.target
this.props.onChangeInput(name, value);
}
render() {
const { inputFoo, inputBaz } = this.props;
return (
<div>
<input
type="text"
name="inputFoo"
value={inputFoo}
onChange={this.handleChangeInput}
/>
<input
type="text"
name="inputBaz"
value={inputBaz}
onChange={this.handleChangeInput}
/>
</div>
);
}
}