Question

我有我的应用程序组件，其中所有内容都被拉入，例如导航，页脚，页面和子页面。我想让一个子页面在您输入时更改导航的外观。

我有document.body.className = 'countdown'，当你调用所述组件时，它对身体的效果很好，但我似乎无法改变导航组件，比如document.nav.className ='someClass'

以下是我的React应用程序的设置方式：

      render() {
    return (
      <div className="App">
          <Nav style={{zIndex: 10000}} navClass={this.state.navClass} />
          <Route path="/welcome" component={Content}/>
          <Route path="/home" component={Content}/>
          <Route path="/projects" component={Projects}/>
          <Route path="/about" component={About}/>
          <Route path="/blog" component={Blog}/>
          <Route path="/contact" component={Contact}/>
          <Route path="/projectpages/galaxy" component={Galaxy}/>
          <Route path="/projectpages/stardates" component={StarDates}/>
          <Footer style={{zIndex: 10000}} />
      </div>
    );
  }
}

export default App;

当您致电stardates时，我希望能够更改Nav的课程（它有一个课程NavClear。

在stardates我有

    class StarDates extends React.Component {

  style = {
    default: { width: 300 },
    onFocus: { borderBottom: '1px solid green' },
    onError: { borderBottom: '1px solid red' }
  }

  check = newValue => newValue < 10
  format = value => `${value} $`

  componentWillMount() {
    document.body.className = 'countdown'
  }

  componentWillUnmount() {
    document.body.className = ''
  }
  render() {
    return (...

我已经尝试过各种各样的东西并通过StackO / Google进行梳理，但我找不到任何答案。任何人都可以帮我这个吗？

谢谢！

componentWillMount更改另一个组件的className

0 个答案: