是指在定义动态路由时,路由参数的名称中可以包含短划线(-)。这样可以使得路由参数更加语义化,易于理解和维护。
例如,假设我们有一个动态路由,用于显示用户的个人信息。我们可以定义一个名为_user-id.vue
的文件作为该路由的组件,并在路由定义中使用短划线来表示用户ID参数:
// pages/_user-id.vue
<template>
<div>
<h1>User Profile</h1>
<p>User ID: {{ $route.params.user-id }}</p>
</div>
</template>
<script>
export default {
// ...
}
</script>
// nuxt.config.js
export default {
// ...
router: {
extendRoutes(routes, resolve) {
routes.push({
name: 'user-profile',
path: '/user/:user-id',
component: resolve(__dirname, 'pages/_user-id.vue')
})
}
}
}
在上述例子中,我们定义了一个名为user-profile
的路由,并使用/user/:user-id
的路径模式来匹配动态的用户ID。在组件中,我们可以通过$route.params.user-id
来访问该参数的值。
这种使用短划线的方式可以使得路由参数的名称更加直观和易读,同时也符合了URL的命名规范。在实际应用中,可以根据具体的业务需求来灵活运用动态路由和短划线命名方式。
推荐的腾讯云相关产品:腾讯云云服务器(CVM)和腾讯云云函数(SCF)。
领取专属 10元无门槛券
手把手带您无忧上云