2016-12-23 4 views
1

私はリアクタとリアクタを使用しています。私の反応ルータ構成では、次のURLを受け入れるルートを追加したい:http://localhost:7000/example/GUID GUIDは、その時点でログインしているユーザーのGUIDです。リアクタルータ - オプションのパラメータを使用してルーティングしない

私はWebPackを使用しています。

私が反応し、ルータをドキュメントに行ってきました:https://github.com/ReactTraining/react-router/blob/master/docs/guides/RouteMatching.md#path-syntax

しかし、それは多分私が何かをしないのです、何らかの理由で動作しません。

これは私のルータの設定を反応させている:私はhttp://localhost:7000/exampleに行くとき

import React from 'react'; 
import { Router, Route, IndexRoute, browserHistory } from "react-router"; 
import Main from "../containers/main.js"; 
import Home from "../containers/home.js"; 
import Example from "../containers/exampleComponent.js"; 

var Routes = (
    <Router history={browserHistory}> 
     <Route path="/" component={Main}> 
      <IndexRoute component={Home} /> 
      <Route path="/example(/:guid)" component={Example} /> 
     </Route> 
    </Router> 
); 

module.exports = Routes; 

、それが正常に動作し、それは例のコンポーネントをロードします。

しかし、私がhttp://localhost:7000/example/GUIDに行くと、動作しません。実際、それは何もロードしません。ドキュメントによると、ルートパスの "()"はオプションであることを示します。

この機能を実現するために他に必要なことはありますか?私はこの1つ上の私の頭...

EDITを傷つけてきた:https://github.com/FredM7/react-base プロジェクトは問題が含まれています。ここに私のgithubのプロジェクトを参照してください。

答えて

1

私もこのようなパスを使用していますpath: 'cn/*/cid/(:catZeroId)(/:catOneId)(/:catTwoId)'それは私のために完璧に動作します。

あなたが反応し、ルータをバージョンの問題を持つかもしれない、私は"react-router": "^3.0.0", "react-router-redux": "^4.0.6",

を使用していますか、あなたのケースをシミュレートするためhttps://jsbin.com/https://plnkr.co/を作成することができます。

+0

こんにちは@veetesh - この問題がある私のgithubプロジェクトを見てください:):https://github.com/FredM7/react-base –

+0

@FrederikMollerあなたは ''を追加する必要がありますindex.htmlまたは静的ファイル[静的ファイルを表現する](https://expressjs.com/en/starter/static-files.html)を提供するいくつかのWebコンテナを設定する必要があります。 –

+0

@FrederikMollerあなたのindex.htmlに ''を追加するか、静的ファイル[静的ファイルを表現する](https://expressjs.com/en)を用意する必要があります。 /starter/static-files.html)。 また、メインルート '" –