ciao!
io ho questa classe che rappresenta un Modal:
codice:
import * as React from "react";
import {Modal, Button} from 'react-bootstrap';
export default class UpdateModal extends React.Component {
constructor(props) {
super(props);
console.log(props);
this.close = this.close.bind(this);
}
close() {
this.setState({showModal: false});
}
render() {
return (
<Modal show={this.props.showModal} onHide={this.close}>
<Modal.Header closeButton>
<Modal.Title>Modal heading</Modal.Title>
</Modal.Header>
<Modal.Body>
{/*<h4>{this.state.upBookId}</h4>*/}
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula.</p>
<h4>Popover in a modal</h4>
<hr/>
</Modal.Body>
<Modal.Footer>
<Button onClick={this.close}>Close</Button>
</Modal.Footer>
</Modal>
);
}
}
nella finestra principale ho fatto così:
codice:
.........
import UpdateModal from './up_modal';
export default class Home extends React.Component {
constructor(props) {
super(props);
this.state = {
books: [],
showModal: false,
upBookId: 0
};
this.open = this.open.bind(this);
}
open() {
this.setState({showModal: true});
}
render() {
return (
<React.Fragment>
<Button
bsStyle="primary"
bsSize="large"
onClick={() => this.open}
>
Launch demo modal
</Button>
<UpdateModal show={this.state.showModal} />
</React.Fragment>
)
}
}
il problema è che nn succede nulla.
non da ne errori ne apre la finestra.
idee??