21.安装vue-router
sh
npm install vue-router
如果在一个模块化工程中使用它,必须要通过 Vue.use()
明确地安装路由功能:
js
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
创建router目录,在router目录下创建index.js
js
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
import A from '@/components/A'
import B from '@/components/B'
export default new VueRouter({
mode: 'history',
routes: [
{
path: '/aaa',
name: 'A',
component: A
},
{
path: '/bbb',
name: 'B',
component: B
}
]
})
在main.js中引入
js
import Vue from 'vue'
import App from './App.vue'
// import VueRouter from 'vue-router'
import router from './router'
Vue.config.productionTip = false
new Vue({
router,
render: h => h(App),
}).$mount('#app')
在App.vue中使用路由
html
<router-link to="/aaa">aaa</router-link>
<router-link to="/bbb">bbb</router-link>
<router-view></router-view>
