URL内の経路パラメータを使用してaxios get要求を実行する方法は？

Question

したがって、APIエンドポイントからデータを取得するアクション作成者があります。

次作品：私の場合は

export function getData(){ 
    return function(dispatch){ 
     axios.get('/api/form/myuser/mytitle').then((res) => { 
      console.log(res.data); 
      return dispatch(retrieve(res.data)) 
     }) 
     .catch((err) => { 
      console.log(err) 
     }) 
    } 
} 

、しかし、APIエンドポイントの変更。 私が最初にこのURLにサーバ要求を実行します。ここでは明らかに

axios.get('/api/form/:userId/:title') 

コンソールログ：私のクライアント側で次のように/api/form/:userId/:titleはその後、私は実際にやりたいことはaxios GETリクエストと上記のアクションの作成者である タイトル文字列を返さない場合は、返す:title

私は何をしようとすることは可能ですか？そうでない場合は、どのように他の提案？

Answer 1

ok、私はこれに答えを見つけました:)

解決策は反応ルータにあります。私はこれに先立って反応ルータに十分に精通していなかった。あなたは、これらのparamsにアクセスすることができます

<Route path = "form/:userId/:formtitle" component = {Form} /> 

次のように

トリックは、それは（お店、またはすべてのあなたのルートを定義するファイル）であるところはどこでも、あなたのルートパスにあなたのparamsを定義することですこのような小道具を経由して、あなたのFormコンポーネントに次のようにあなたの行動の作成者が利用できる上記の小道具を持っているために、

this.props.params.userId 
this.props.params.formtitle 

、あなたは、あなたがあなたのコンポーネントでトリガーアクションの作成者のパラメータとしてそれらを使用することができます。

をここでは210の

this.props.getData (this.props.params.userId, this.props.params.formtitle) 

詳細：https://github.com/reactjs/react-router-tutorial/tree/master/lessons/08-index-routes

Answer 2

私はテンプレート文字列は、あなたの問題のための快適な解決策になることができると思います。してください、Alt Gr + 7を使用することを躊躇しないでください！ :)

axios.get(`/api/form/${userId}/${title}`) 

慎重に未定義の値を使用してください。

https://developer.mozilla.org/hu/docs/Web/JavaScript/Reference/Template_literals