Vue.JS 将模板/组件添加到 router.js答案

【问题标题】：Vue.JS Adding template/component to router.jsVue.JS 将模板/组件添加到 router.js
【发布时间】：2019-09-19 01:27:49
【问题描述】：

如果有人回答我如何在 Vue.js 中将一些模板导入到 route.js 中，我将非常感激:)

这是我的html

 <head>
 
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
    <script src="https://unpkg.com/vue-router/dist/vue-router.js"></script> 

</head>
<body>
 <div id="app">
   <router-link to="/main">Main Page</router-link>
   <router-link to="/blog">Blog</router-link>
   <router-link to="/contact">Contact</router-link>
  
   <router-view></router-view>
 </div>
   
   <script src="/router.js"></script>  
 </body>

接下来，我粘贴我的 router.js

const Main = {template: '<p>Main page</p>'  }
const Blog = {template: '<h1>Blog</h1>' }
const Contact = {template: '<h1>Contact</h1>' }


const routes = [
 { path: '/main', component: Main },
 { path: '/blog', component: Blog },
 { path: '/contact', component: Contact }
]

const router = new VueRouter({ routes })

const routeapp = new Vue({ router }).$mount('#app')

一切正常，但我想将带有自己的样式、Js、css 的模板导入每个视图。我该如何导入它？
我写在这里是因为在互联网上找不到任何信息

【问题讨论】：

嗨 Dima，如果您要添加有关您正在使用的 vuejs 版本的信息，这可能会有所帮助。

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

【解决方案1】：

对于每条路线，您都提到了 path 和 component。

组件可以是任何 Vue JS 组件。因此，您可以查看Vue JS library 文档。

同时，如果你需要一个使用 Vue Router 的示例，并带有一些定义更明确的组件，你可以参考这个教程：

https://scotch.io/tutorials/getting-started-with-vue-router

【讨论】：