vue加router

Vue.js是一个流行的JavaScript框架，Vue Router是Vue.js官方的路由管理器。Vue Router可以帮助我们在Vue.js应用程序中实现客户端路由。以下是一个简单的Vue.js应用程序如何使用Vue Router的例子：

1.首先，需要安装Vue Router。可以使用npm或yarn进行安装：

npm install vue-router

2.在Vue.js应用程序中导入Vue Router并使用它：

import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path: '/about',    name: 'About',
    component: About
  }
]

const router = new VueRouter({
  routes
})

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

在上面的代码中，我们首先导入Vue和Vue Router。然后，我们使用Vue.use()方法来安装Vue Router。接下来，我们定义了一个路由数组，其中包含两个路由对象。每个路由对象都有一个路径、一个名称和一个组件。最后，我们创建了一个Vue Router实例，并将其传递给Vue实例。

3.在Vue.js应用程序中使用<router-link>和<router-view>标签：

<template>
  <div id="app">
    <router-link to="/">Home</router-link>
    <router-link to="/about">About</router-link>
    <router-view></router-view>
  </div>
</template>

在上面的代码中，我们使用<router-link>标签来创建链接到不同路由的链接。我们还使用<router-view>标签来渲染当前路由的组件。