change boolean value on click react
class Q1 extends Component {
constructor(props) {
super(props);
this.state = { page1: false,
page2:false,
page3:false }
this.handleClick1= this.handleClick1.bind(this);
this.handleClick2= this.handleClick2.bind(this);
this.handleClick3= this.handleClick3.bind(this);
}
handleClick1() {
this.setState({ page1: true})
console.log("button1 clicked")
}
handleClick2() {
this.setState({ page2: true})
console.log("button2 clicked")
}
handleClick3() {
this.setState({ page3: true})
console.log("button3 clicked ")
}
render() {
return (
<div>
<button onClick={this.handleClick1}
>Event Giveaway</button><br/>
<button onClick={this.handleClick2}
>Corporate Merchandise</button><br/>
<button onClick={this.handleClick3}>
Rewards & Recognition</button><br/>
<a href="/" class="back_button"><ArrowBackIcon style={{color:"white"}}/></a>
{
this.state.page1 ?
(
<a href="/q2">Next</a>
)
:
(
this.state.page2 ?
(
<a href="/q22">Next</a>
) :
(this.state.page3 ?
(
<a href="/q23">Next</a>
)
:
(
<a href="">Next</a>
)
)
)
}