react-toolbox链接刷新整个页面

Question

我在我的一个项目中使用了react-toolbox。

应用程序结构

App
--Navigation
--Content
App

应用程序组件

<div>
  <HomeNav />
  {this.props.children}
</div>

HomeNav组件

import { Link } from 'react-router';
...
<Navigation type="horizontal">
  <Link to="animals">Animals</Link>
  <Link to="plants">Plants</Link>
</Navigation>

注意:从react-router导入的Link

路线

<Route path="/" component={App}>
  <IndexRedirect to="/animals" />
  <Route path="animals" component={AnimalsPage} />
  <Route path="plants" component={PlantsPage} />
</Route>

这与预期的一样工作正常；在路由之间切换时只刷新Content。但是当我使用react-toolbox中的Link组件时，整个页面都被刷新了。

import { Link } from 'react-toolbox/lib/link';
...
<Navigation type="horizontal">
  <Link
    active
    href="animals"
    label="Animals"
  />
  <Link
    href="plants"
    label="Plants"
  />
</Navigation>

有什么方法可以改变这种行为吗？

在react-toolbox文档中，#用于路由(#/components/link)。但是我在我的路由中使用#是有限制的。

Answer 1

我把它弄好了：

import AppBar from 'react-toolbox/lib/app_bar';
import {Link} from 'react-router-dom';

<AppBar title={viewModelProps.headerTitle} leftIcon="menu">
  <Link to="/">Home</Link>
  <Link to="/login">Login </Link>
</AppBar>