the given are the files i created as js file.....clicking button in the same file which I commented the button tag in output.js that is working fine and if i change the button in different page that is the confusion
output.js
import React, {Component} from 'react'
import { Modal, Button } from 'react-bootstrap'
class Threed extends Component {
constructor(){
super()
this.state ={show:false}
}
threedModal(){
this.setState({show:!this.state.show})
}
render() {
return (
<div>
{/*<Button onClick= {() => {this.threedModal()}}>
rajesh
</Button>*/}
<Modal show={this.state.show} onHide={() => this.handleModal()}>
<Modal.Header closeButton>MY popup</Modal.Header>
<Modal.Body>Rajesh modal done</Modal.Body>
<Modal.Footer><Button onClick= {() => {this.handleModal()}}> close </Button></Modal.Footer>
</Modal>
</div>
)
}
}
export default Threed
home.js
import React, {Component} from 'react'
import { Modal, Button } from 'react-bootstrap'
import threed from './output.js'
class Threed extends Component {
constructor(){
super()
this.state ={show:false}
}
threedModal(){
this.setState({show:!this.state.show})
}
render() {
return (
<div>
<Button onClick= {() => {this.threedModal()}}>
rajesh
</Button>
</div>
)
}
}
export default Threed
I want to show while clicking home.js button and show the modal popup window...... here my confusion is how to get that fuction by clicking button of Home.js
Please forward the value to modal.
Home.js
import Threed from './output.js'
class Home extends Component {
...
< Threed show={this.state.show} />
Threed.js
<Modal show={this.props.show} onHide={() => this.handleModal()}>