60 lines
1.1 KiB
JavaScript
60 lines
1.1 KiB
JavaScript
|
|
|
|
function LoginButton(props) {
|
|
return (
|
|
<button onClick={props.onClick}>
|
|
Login
|
|
</button>
|
|
);
|
|
}
|
|
|
|
function LogoutButton(props) {
|
|
return (
|
|
<button onClick={props.onClick}>
|
|
Logout
|
|
</button>
|
|
);
|
|
}
|
|
|
|
class LoginCtr extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
|
|
this.state = {
|
|
isLoggedIn: false
|
|
}
|
|
|
|
this.handleLoginClick = this.handleLoginClick.bind(this);
|
|
this.handleLogoutClick = this.handleLogoutClick.bind(this);
|
|
}
|
|
|
|
handleLogoutClick() {
|
|
this.setState({isLoggedIn: false})
|
|
}
|
|
|
|
handleLoginClick() {
|
|
this.setState({isLoggedIn: true})
|
|
}
|
|
|
|
|
|
render() {
|
|
const isLoggedIn = this.state.isLoggedIn;
|
|
let btn;
|
|
if (isLoggedIn) {
|
|
btn = <LogoutButton onClick={this.handleLogoutClick}/>
|
|
} else {
|
|
btn = <LoginButton onClick={this.handleLoginClick} />
|
|
}
|
|
return (
|
|
<div>
|
|
{btn}
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
ReactDOM.render(
|
|
<LoginCtr />,
|
|
document.getElementById('root')
|
|
);
|