Router API - wookikiik/react_study GitHub Wiki
useRouteMatch
์ match๊ฐ์ฒด์ ๊ฐ์ ์ ๊ทผํ ์ ์๊ฒ ํด์ฃผ๋ hook์
๋๋ค.
๋ํ ์ธ์๋ก <Route>
์ปดํฌ๋ํธ์ ํ๋กํผํฐ๋ค(path, strict, sensitive, exact)์ ๊ฐ์ง ๊ฐ์ฒด๋ฅผ ๋ฐ์ ์ ์์ผ๋ฉฐ,
๋ง์ฝ pathํ๋กํผํฐ์ ํ์ฌ ํ์ด์ง์ URL์ด ์ผ์นํ ๊ฒฝ์ฐ ํด๋น path์ match๊ฐ์ฒด๋ฅผ ๋ฐํํ๊ณ ์ผ์นํ์ง ์์ ๊ฒฝ์ฐ null์ ๋ฐํํฉ๋๋ค.
๋ง์ฝ ์๋ฌด ์ธ์๋ ๋๊ฒจ์ฃผ์ง ์๊ณ ํด๋น hook์ ํธ์ถํ๋ฉด withRouter HoC๋ก
match๊ฐ์ฒด๋ฅผ ์ ๊ทผํ์ ๋์ฒ๋ผ ์ ์ผ ๊ฐ๊น์ด ๋ถ๋ชจ <Route>
์ปดํฌ๋ํธ์ match๊ฐ์ ๋ฆฌํดํฉ๋๋ค.
// use case 1
const match = useRouteMatch({
path: '',
strict: true,
sensitive: true,
exact: true,
});
// use case 2
const match = useRouteMatch();
useRouteMatch props | |
---|---|
prop | discription |
path | ํ์ฌ ์์น์ pathname์ ๋๋ค. |
strict | true๋ฉด, ์ฌ๋์๊ฐ ์๋ ๊ฒฝ๋ก๋ ์ฌ๋์๊ฐ ์๋ location.pathname๊ณผ ์ผ์นํด์ผ๋ง ์ธ์ ํฉ๋๋ค. |
sensitive | ๋์๋ฌธ ๊ตฌ๋ฌธ |
exact | URL ์ ์ฒด path๊ฐ ์ ํํ๊ฒ ์ผ์น |