...
class AddForm extends Component {
constructor() {
super();
}
getValue() {
let refsValue = [{
price: this.refs.price.value,
remarks: this.refs.remarks.value
}];
return refsValue;
}
render() {
return (
<div>
<input type="number" name="price" ref="price" />
<input type="text" name="remarks" ref="remarks" />
</div>
);
}
}
class BankForm extends Component {
constructor() {
super();
this.onSubmit = this.onSubmit.bind(this);
}
onSubmit() {
console.log(getValue());
}
render() {
return (
<div>
<button onClick={ this.onSubmit }>Submit</button>
</div>
);
}
...
&#13;
我如何从getValue返回onSubmit?
getValue() { ... return refsValue; } -> onSubmit() { console.log(getValue()) }
请更正onSubmit的内容!
抱歉我的英语不好
答案 0 :(得分:0)
这些看起来像两个单独的类。它们根本没有关联,因此您将无法获得任何值。
您需要在BankForm中重构和渲染AddForm。我建议将AddForm作为无状态组件并通过getValues(或将getValues的内容放在onSubmit中)作为onSubmit作为prop。
class BankForm extends Component {
constructor() {
super();
this.onSubmit = this.onSubmit.bind(this);
}
onSubmit(e) {
e.preventDefault();
console.log(e.target.price.value);
}
render() {
return (
<AddForm onSubmit={this.onSubmit} />
);
}
}
function AddForm(props) {
return (
<div>
<form onSubmit={props.onSubmit}>
<input type="number" name="price" />
<input type="text" name="remarks" />
<button type="submit">Submit</button>
</form>
</div>
);
}