是否可以使用 Nuxt JS 检查动态路由中的路由参数数据类型答案

【问题标题】：Is it possible to check route param data type in dynamic routes with Nuxt JS是否可以使用 Nuxt JS 检查动态路由中的路由参数数据类型
【发布时间】：2021-10-07 02:14:08
【问题描述】：

基本上我有以下嵌套的动态路由

pages/
--| _category/
-----| _page.vue
-----| _id.vue

我想在_page 参数是integer 时使用页面组件，并在它是字符串时使用id compnenet。

例子

/pages/phones/1 -> 页面组件

/pages/phones/6105565f363abdcce20fc189 -> id 组件

【问题讨论】：

也许您可以使用/pages/phones/id-:id 和/pages/phones/page-:page 来代替它们，但在我看来，与/pages/phones/1 相比，/pages/phones?page=1 可能是更好的选择
不幸的是，由于 SEO，我无法更改网址。 /pages/phones?page=1 绝对是个好主意，但为时已晚。

标签： vue.js nuxt.js vue-router

【解决方案1】：

也许你可以在你的/pages/_category/_param.vuenuxt-page-component 中使用is：

/pages/_category/_param.vue

<template>
    <component :is="el" :id="param" :page="param"/>
</template>
<script>
import Show from './_id.vue';
import Index from './_page.vue';
export default{
    components: {
        Show, Index
    },
    props: {
        param: {
            required: true
        }
    },
    computed: {
        el(){
            return /[a-zA-Z]/g.test(this.param) ? 'show' : 'index';
        }
    }
}
</script>

【讨论】：