Vue.jsでrouter-link内のcomputedが呼び出されない

<template>
<div class="about">
  <h1>Page:{{$route.params.page}}</h1>
  <router-link :to="'/paging/${prevPage}'">Prev</router-link>
  <router-link :to="'/paging/${nextPage}'">Next</router-link>
</div>
</template>
<script>
export default {
  computed: {
    prevPage() {
      return Number(this.$route.params.page) - 1
    },
    nextPage() {
      return Number(this.$route.params.page) + 1
    }
  }

}
</script>

import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path: '/about',
    name: 'About',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
  },
  {
    path: '/counter',
    component: () => import(/* webpackChunkName: "count" */ '../views/Count.vue')
  },
  {
    path: '/paging/:page',
    component: () => import(/* webpackChunkName: "paging" */ '../views/Paging.vue')
  }
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

export default router

<template>
<div id="app">
  <div id="nav">
    <router-link to="/">Home</router-link> |
    <router-link to="/about">About</router-link> |
    <router-link to="/counter">Counter</router-link>
  </div>
  <router-view />
</div>
</template>