import Vue from 'vue' import Router from 'vue-router' import HelloWorld from '@/components/HelloWorld' import FunctionComponent from '@/components/FunctionComponent' import InstructionComponent from '@/components/InstructionComponent' new Vue({ Router, el: '#app' }); export default new Router({ routes: [ { path: '/', name: 'HelloWorld', component: HelloWorld }, { path: '/function', name:'FunctionComponent', component: FunctionComponent }, { path: '/instruction', name:'InstructionComponent', component: InstructionComponent } ] })
时间: 2024-03-30 10:35:25 浏览: 85
使用vue官方提供的模板vue-cli搭建一个helloWorld案例分析
这是一个使用Vue.js框架的路由器配置代码。其中,`Vue`和`Router`分别引入了Vue.js框架和Vue Router库。`HelloWorld`、`FunctionComponent`和`InstructionComponent`是应用程序中的三个组件,分别对应不同的路由路径。`routes`是一个数组,包含了应用程序中所有的路由,每个路由都包含一个`path`属性,表示路由路径,一个`name`属性,表示路由名称,以及一个`component`属性,表示路由所对应的组件。最后,使用`export default`语句导出路由器对象,以便其他组件可以使用它。在Vue实例中,使用`Router`属性指定路由器类,并将实例挂载到`#app`元素上。
阅读全文