Reduxを持つ反応ルータのURLクエリ文字列値にアクセスする方法

Question

URLにはさまざまなクエリ文字列の値があります。

http://localhost:3000/product/?id=123&name=test 

私はreduxを使用して同形アプリケーションに取り組んでいます。だから私はアクションを発射していると私はどのように私はアクションファイルを還元するこれらのクエリ文字列の値を取得することができます知っている？

export function getProductData(params) { 

    debug('Action Requested:' + params); 

    return { 
    type: GET_PRODUCT_DATA, 
    promise: request.get(API_URL + params.productId) 
    } 
}; 

実際には私はAPIコールを実行しているので、そのIDをクエリ文字列の値から取得する必要があります。

Answer 1

URLからパラメータあなたの経路に従ってあなたが

<Route path="/product/:productid" component={Product} /> 

のようなルートを持っている場合は、小道具を使用してProduct Componentから商品コードにアクセスし、自分の行動にそれを渡すことができますので、props.params を使用してコンポーネントに伝搬されます。

const Product = (props) => 
    <div> 
    <button onClick={e => props.getProductData(props.params)}>Do Some Action</button> 
    </div>; 

ここで、props.paramsには、ルートで定義したすべてのパラメータが保持されます。我々の場合、productidの値はprops.params.productidになります。

Answer 2

あなたは、ルータに反応先に行くとprops.location.query

経由してアクセス使用している場合は、最終的のようなものに見えるでしょう：

const Product = (props) => 
    <div> 
    <button onClick={e => props.getProductData(props.location.query)}>Do Some Action</button> 
    </div>;