1
私は現在、反応jsのバリデーションに取り組んでおり、バリデーションには材料uiを使用しています。だから私はすべての検証ロジックを持つ共通のコンポーネントを1つ持っています。 すべてのフィールド値を取得するために共通コンポーネントの状態を設定しました。子コンポーネントでこれらの値が必要です。子コンポーネントのボタンsubmitSubmit()をクリックして各フィールドを検証します。これを達成する方法を教えてください。私の親コンポーネント以下 :親コンポーネントから子コンポーネントにデータを渡し、反応jsマテリアルuiのフィールドを検証する方法は?
export default class CommonTextBox extends React.Component {
constructor(props) {
super(props);
this.state = {
firstName:'',
email:'',
floatingLabel: '',
};
this.handleChange = this.handleChange.bind(this);
}
handleChange(evt) {
if (this.props.name === 'a') {
this.setState({ firstName: evt.target.value });
} else if (this.props.name === 'b') {
this.setState({ email: evt.target.value });
}
}
render() {
return (
<div>
<TextField maxLength='40' errorText='' floatingLabelText={this.state.floatingLabel} onChange={this.handleChange} />
</div>
);
}
}
Below my child component:
export default class PhysicianDetails extends React.Component {
constructor(props) {
// alert(1)
super(props);
this.state = {
};
this.handleSubmit = this.handleSubmit.bind(this);
}
handleSubmit() {
}
render() {
return (
<div>
<CommonTextBox name='a' />
<CommonTextBox name='b' />
<RaisedButton label='Save' onClick={this.handleSubmit} />
</div>
);
}
}