Vue路由(router)的安装与引入
vue路由的安装与引用
·
安装
(一)创建Vue项目时安装
// 在终端中创建Vue项目
vue create xxxx (文件名)
在之后出现的选择菜单中自定义安装,选择 router 进行安装:
(二)在终端中安装
// 在终端中输入
npm install vue-router --save
引入
在 main.js 文件中引入 router
import Vue from 'vue'
import App from './App.vue'
import router from './router'
// 阻止启动生产消息
Vue.config.productionTip = false
new Vue({
router,
render: h => h(App)
}).$mount('#app')
在 src 文件夹中的 router 文件夹下的 index.js 文件中配置路由信息
1.Vue作为一个单页面应用路由一般分为,路由组件与一般组件,路由组件一般放在 pages 文件夹中,一般组件通常放在 components 文件夹中
2.每个组件都有自己的 $route 属性,里面存储着自己的路由信息,可以通过组件的this.route
属性获取到,但是整个项目只有一个 router 属性,可以通过组件的this.router
属性获取到
3.每个组件的 $route 属性并不相同,但是每个组件的 $router 属性是相同的
this.route中,route前有 $ 符号
this.router 中,router 前有 $ 符号
更多推荐
已为社区贡献1条内容
所有评论(0)