vue.js
nuxt.js

vue-routerやnuxt.jsのqueryでの遷移で再レンダーが走らない時の対処法

下記の様なリンクを作ったときに再レンダーしない時の対処法

<router-link :to="{path: hoge, query: {name: `${fuga}`}}">
  {{ fuga }}へ
</router-link>

vue-routerの場合

<router-view :key="$route.fullPath" />

とすると良いらしい。

nuxt.jsの場合

layoutディレクトリの<nuxt />に設定する

default.vue
<template>
  <nuxt :nuxt-child-key="$route.fullPath" />
</template>

nuxtで動的ページ扱いにすればいい話なんだけど、検索クエリでも再レンダーしたくて困ったけど解決できた。