路由

自动线路

大多数网站都会有不止一个页面(例如首页,关于页面,联系页面等)。为了显示这些页面,我们需要一个路由器。这就是vue-router出现的原因。在使用Vue应用程序时,您必须设置一个配置文件(即。router.js),并手动添加所有的路由。js自动生成vue-router文件中提供的Vue文件为您配置页面目录中。这意味着您再也不必编写路由器配置了!Nuxt.js还为所有路由提供自动代码拆分。

换句话说,要在应用程序中拥有路由,您所要做的就是创建.vue文件页面文件夹中。

了解更多关于<一个href="//www.lycasleep.com/docs/2.x/features/file-system-routing" data-v-0c2f18f5>路由

要在应用程序的页面之间导航,你应该使用<一个href="//www.lycasleep.com/docs/2.x/features/nuxt-components" data-v-0c2f18f5>NuxtLink组件。这个组件包含在Nuxt.js中,因此你不必像导入其他组件那样导入它。它类似于HTML<一>标签,只不过不用href = " /“我们使用=”/“.如果你用过vue-router之前,你可以想想< NuxtLink >作为替代< RouterLink >

控件的简单链接index.vue在你的页面页面文件夹:

页面/ index.vue
<模板><NuxtLink/>主页NuxtLink>模板>

对于站点内所有页面的链接,请使用< NuxtLink >.如果你有其他网站的链接,你应该使用<一>标签。请看下面的例子:

页面/ index.vue
<模板><主要><h1>主页h1><NuxtLink/对>About(属于Nuxt App的内部链接)NuxtLink><一个href//www.lycasleep.com>外部链接到另一个页面一个>主要>模板>

了解更多有关<一个href="//www.lycasleep.com/docs/2.x/features/nuxt-components" data-v-0c2f18f5>NuxtLink组件

贡献者

发现了一个错误还是想对文档做出贡献?<一个href="https://github.com/nuxt/www.lycasleep.com/blob/main/content/en/guides/get-started/routing.md" target="_blank" rel="noopener" class="text-primary-base hover:underline">在GitHub上编辑此页!