TIL] React-Dynamic Routing


Routerが所有するデフォルトのprops


  • history:push/replaceで他の経路に移動できます.
    (ex:ログインが成功したら、ログインページ来源ホームページに移動)
  • location:現在のパスの情報(+Url query)を持つ.
    (前のパス/現在のパスを比較する必要がある場合は、対応するpropsを使用します)
  • match:どのルートにマッチするかについての情報とparamsという情報を持つ.
    (ex:product/detail/:idを使用して、固有idに関する情報のみを表示できます.리스트 페이지 › 상세 페이지、ここ:後の変数名は何でも構いません.)

  • Query Parameter vs Path Parameter

    Query Parameter:商品の注文やフィルタリングに使用できます.
    /products?price_in=high > 상품 전체의 목록 중 가격이 높은것만 가져온다.
    String Parameter:特定商品の情報を認識する必要がある場合のみ使用する.
    /products    			> 상품 전체의 목록을 가져온다.
    /products/1  			> id 값이 1인 상품 정보를 가져온다.