🎈 この記事はWP専用です
https://wp.me/pc9NHC-eI
前置き
とっても便利なparams, queryについてご紹介🌟
同じコンポーネントを見せたいけど、
カテゴリごとにURLだけを変えたい…
一覧ページからソートして表示させたい…
そんな時に便利です♪
params, queryについて
いくつかに分けて書きます✍️
router-linkが分かれば簡単です🌟
まだ不安な方のためにも
複数の書き方で記載しました🍒
params, queryの違い
まずはURLを見るのが
分かりやすいと思います🎈
localhost:3000/param/param?query=123
パスパラメーター(param)
?より前の部分、省略できない
クエリパラメーター(query)
?以降の部分、省略できる
directoryとの関係①
localhost:3000/project123
projectごとにURLを変更
表示ページは同じでコンポーネントで表示分け
file
pages/
--| _id/
-----| index.vue
directoryとの関係②
localhost:3000/events?today=true
events/index.vueの中で
today=trueでソートをかけて表示
file
pages/
--| events/
-----| index.vue
eventsは絶対省略できないですね。
pages/events/index.vueに
行けなくなってしまいます。
?today=trueは省略しても
ソートが外れるだけなので
ページはきちんと表示されます♪
メリット
🎈 続きはWPでご覧ください👀
https://wp.me/pc9NHC-eI