Merge pull request #14 from hisasann/feature/add-routing-validate

feat: add routing validate

Author: hisasann

src/pages/example/index.vue

@@ -51,6 +51,10 @@ section
     nuxt-link(to='/example/now-utcoffset') now-utcoffset
   p
     nuxt-link(to='/example/vue-carousel') vue-carousel
+  p
+    nuxt-link(to='/example/routing-validate/true') routing-validate - validate is true
+  p
+    nuxt-link(to='/example/routing-validate/false') routing-validate - validate is not true
 </template>
 
 <script lang="ts">

src/routed-pages/routing-validate.vue

@@ -0,0 +1,38 @@
+<template lang="pug">
+section.container
+  h1.title
+    | routing-validate
+  div
+    p path: {{ path }}
+    p params: {{ params }}
+    p query: {{ query }}
+</template>
+
+<script lang="ts">
+import { Component, Vue } from 'nuxt-property-decorator'
+
+@Component
+export default class extends Vue {
+  public asyncData({ route }: any) {
+    return {
+      path: route.path,
+      params: route.params,
+      query: route.query
+    }
+  }
+
+  public validate({ params, query, store }) {
+    if (params.condition === 'true') {
+      return true // params バリデーションを通過したとき
+    }
+
+    return false // Nuxt.js がルートをレンダリングするのを中止して、エラーページを表示させる
+  }
+
+  public head() {
+    return {
+      title: 'routing-validate'
+    }
+  }
+}
+</script>

src/routers/index.ts

@@ -1,4 +1,5 @@
 import customPath from './custom-path'
+import routingValidate from './routing-validate'
 import include from './include'
 
-export default [customPath, include]
+export default [customPath, routingValidate, include]

src/routers/routing-validate.ts

@@ -0,0 +1,11 @@
+import INuxtRoute from '../interfaces/INuxtRoute'
+
+export default function(
+  resolve: (dirname: string, routeDir: string) => string
+): INuxtRoute {
+  return {
+    name: 'routing-validate',
+    path: '/example/routing-validate/:condition/',
+    component: resolve(__dirname, '../routed-pages/routing-validate.vue')
+  }
+}