react-router v4 中的Link标签点击后为什么不会自动重绘？

Question

Welcome To Ask or Share your Answers For Others

react-router v4 中的Link标签点击后为什么不会自动重绘？

asked Feb 6, 2021 in Technique[技术] by 深蓝 (71.8m points)

react-router v4 中的Link标签点击后为什么不会自动重绘？

使用的库名：react-router-dom

App组件（根组件）

class App extends Component {
  render() {
    return (
      <Router>
        <Div className="app">
          <Nav />
          <Body />
          <Footer />
        </Div>
      </Router>
    );
  }
}

Nav组件（导航组件）

class Nav extends Component {
  render() {
    Switch
    return <Header>
      <Brand>TSZ</Brand>
      <List>
        <li><Link to="/">Home</Link></li>
        <li><Link to="/history">History</Link></li>
        <li><Link to="/about">About</Link></li>
      </List>
    </Header>
  }
}

Body组件（路由实际内容的组件）

const Body = observer(class Body extends Component {
  render() {
      return <div style={{height: '100%'}}>
        <Route exact path="/" component={Home}/>
        <Route path="/history" component={History}/>
      </div>
  }
})

问题描述： 点击Link标签时，页面的URL确实改变了，但是组件却没有重绘。请问是我哪里弄错了吗？

与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…