我在我的测试组件中渲染了 EditModal 组件。我通过“this.edit”引用它。我将 UserForm 组件作为提示传递给 EditModal。我也尝试参考它。但是“this.form”返回未定义。
为什么?有没有办法解决这个问题?
class Test extends React.Component {
test(){
this.form.someMethod();
}
render() {
return (
<div>
<EditModal form={<UserForm ref={(form) => { this.form = form; }} />} ref={(edit) => { this.edit = edit; }}/>
</div>
);
}
}
export default Test;
//EditModal.js
class EditModal extends React.Component {
constructor() {
super();
this.handleShow = this.handleShow.bind(this);
this.handleClose = this.handleClose.bind(this);
this.state = { show: false};
}
handleClose() {
this.setState({ show: false });
}
handleShow(id) {
this.setState({ show: true, currentId: id});
}
render() {
return (
<Modal show={this.state.show} onHide={this.handleClose}>
<Modal.Header closeButton={false}>
<Modal.Title>Uprav zaznam</Modal.Title>
</Modal.Header>
<Modal.Body>
{this.props.form}
</Modal.Body>
<Modal.Footer>
<Button onClick={this.handleClose}>Zatvorit</Button>
</Modal.Footer>
</Modal>
);
}
}
export default EditModal;