这里是我自己踩过的一个坑,也许是学术不精,没有在一开始领悟到子页面如何展示,这里放一个小栗子,方便以后遇见时查看:
小栗子:
- 新闻列表路由 : your_domain/en/news;新闻详情路由:your_domain/en/news/${id}
- pages中: pages/news
1 <script> 2 import News from './news/index' 3 export default News 4 </script>
pages/news/_id.vue
<script> import NewsDetail from '../_lang/news/_id' export default NewsDetail </script>
pages/news/index.vue
1 <script> 2 import NewsIndex from '../_lang/news/index' 3 export default NewsIndex 4 </script>
- pages/_lang 中:
- pages/_lang/news.vue 用于子页面的展示
<template> <div> <NuxtChild :key="$route.params.id" /> </div> </template>
pages/_lang/news/_id.vue 这里才是真正的新闻详情页面内容
pages/_lang/news/index.vue 这里才是真正的新闻列表页内容