1

プロジェクトの 1 つで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>

注:Linkからインポートreact-router

ルート

<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ドキュメントでは#、routes( #/components/link) で使用されています。#しかし、ルートでの使用には制限があります。

4

1 に答える 1