реагировать-материализировать SideNav - PullRequest
Новая
       5

реагировать-материализировать SideNav

0 голосов
/ 21 сентября 2018

Я работаю над сайтом и пытаюсь использовать SidNav из реагировать-материализовать .У меня есть маршрутизатор с отображением двух компонентов: 

<Router>
    <div>
      <Route path="/" component={NavBar} />
      <Route path="/" component={Home} />
    </div>
  </Router>

Я хочу поместить кнопку триггера NavBar в компонент Home. 

<SideNav
    trigger={<Button>SIDE NAV DEMO</Button>}
    options={{ closeOnClick: true }}
  >

  </SideNav>

Я хочу повторно использовать боковую панель в несколькихкомпонент, как я мог это сделать?

1 Ответ

0 голосов
/ 21 сентября 2018

Вы можете написать свой код, как этот

ResusableSideNav.js 

import 'react' from 'React'
import sideNave from 'react/materialcomponent'

class ResusableSideNav extends React.component {
    render(){
        return(
            <SideNav
                trigger={<Button></Button>}
                options={{ closeOnClick: true }}
            >
                <SideNavItem userView
                        user={{
                        background: 'img/office.jpg',
                        image: 'img/yuna.jpg',
                        name: this.Prop1.value,
                        email: this.Prop2.value
                    }}
                />
            </SideNav>
        )
    }
}

Home.js 

import 'react' from 'React'
import ResuableSideNav from the "address where you worte"

class Home extends React.Component {
    render(){
        <ResuableSideNav prop1={value} {...otherProps}/>
    }
}
...