notification bar callback

This commit is contained in:
snoop 2017-07-12 17:56:42 +09:00
parent 4eb3e145e9
commit 648c7a6561
4 changed files with 12 additions and 9 deletions

View File

@ -13,6 +13,9 @@ import { Components } from './containers/test/Components';
export class Routes extends React.Component<any, any> { export class Routes extends React.Component<any, any> {
constructor(props: any, context: any) {
super(props, context);
}
render() { render() {
return ( return (
<div> <div>

View File

@ -94,7 +94,7 @@ export class TopBar extends React.Component<any, any> {
<Icon name='setting' size='large' /> <Icon name='setting' size='large' />
</Menu.Item> </Menu.Item>
<Menu.Item onClick={() => { <Menu.Item onClick={() => {
this.setState({ notification_visible: !this.state.notification_visible }) this.props.onSidebar();
}}> }}>
<Label color='teal' horizontal>22</Label> <Label color='teal' horizontal>22</Label>
</Menu.Item> </Menu.Item>

View File

@ -12,7 +12,7 @@ export class Header extends React.Component<any, any> {
render() { render() {
return ( return (
<TopBar/> <TopBar onSidebar={this.props.onSidebar}/>
); );
} }
} }

View File

@ -14,13 +14,18 @@ export class Layout extends React.Component<any, any> {
constructor(props: any, context: any) { constructor(props: any, context: any) {
super(props, context); super(props, context);
this.state = { this.state = {
notification_visible:false,
}; };
} }
onSidebar = () => {
this.setState({notification_visible:!this.state.notification_visible})
}
render() { render() {
return ( return (
<div> <div>
<Header /> <Header onSidebar={this.onSidebar.bind(this)}/>
<Sidebar.Pushable as={Segment} vertical > <Sidebar.Pushable as={Segment} vertical >
<Sidebar <Sidebar
as={Menu} as={Menu}
@ -48,13 +53,8 @@ export class Layout extends React.Component<any, any> {
<Sidebar.Pusher > <Sidebar.Pusher >
<Segment vertical> <Segment vertical>
<button placeholder='menu' onClick={() => {
this.setState({ notification_visible: !this.state.notification_visible })
}}> sidebar </button>
<Container> <Container>
<Router history={history}> <Router history={history} >
<Routes /> <Routes />
</Router> </Router>
</Container> </Container>