在 vue.js 中实现路由的最简单方法是什么？答案

【问题标题】：What's the easiest way to implement routes in vue.js?在 vue.js 中实现路由的最简单方法是什么？
【发布时间】：2019-06-11 10:29:53
【问题描述】：

我很难理解如何使用官方指南在 vue.js 中实现路由，有没有办法简化流程？

【问题讨论】：

请编辑您的问题以具体说明您遇到的问题。正如所写，这太宽泛（而且不清楚）：您提到您想要简化流程，但不清楚您指的是什么。
在Vue中实现路由主要有两种方式：vue-router（大部分工作在客户端）和nuxt（大部分工作在服务器端）。如果您使用vue ui 设置项目，它会为您提供将 vue-router 自动添加到生成的项目中的选项，如果您在手动添加它时遇到困难。
有一天我实现了vue.router，不知道是不是我，但是我发现这个范式很难理解，我来自java（Springboot框架）和php

标签： vue.js

【解决方案1】：

您可以使用 Vue 路由器库。这里的 components 是添加 vue 组件的文件夹。变量“path”指的是url路由。

这是我创建的示例路由器文件。

     import Vue from "vue";
     import Router from "vue-router";

     Vue.use(Router);

     export default new Router({
       routes: [
       {
          path: "/",
          component: () => import("@/components/Login"),    
       },
       {
          path: "/home",
          name : "home",
          component: () => import("@/components/Home"),   
       },
     ]
    });

请参考此文档：https://vuejs.org/v2/guide/routing.html

另外，将您的路由器文件导入应用程序初始化。

 import router from "./router";

 new Vue({
   router,
   render: h => h(App)
 }).$mount("#app");

【讨论】：

你应该链接文档和 npm install 命令来添加包
我可以用html做吗？比如 import("@/start.html")
您必须在您的应用程序中安装 vue-router 库。参考：router.vuejs.org。此外，您可以将路由器文件导入应用程序初始化。请看我编辑的答案