热门

最新

红包

立Flag

投票

同城

我的

发布
caijilxy
别离三千净此生
3 年前
truecaijilxy

路由就是一组 key-value的对应关系 路径-组件
多个路由就要经过路由器管理

路由为了做单页面应用 无页面跳转 局部更新

在终端中输入 npm i vue-router 安装目前最高版本
npm i vue-router@3 安装指定版本 3版本 支持vue2.0

创建router文件夹 专门用于创建整个应用的路由器
其中再创建index.js
import VueRouter from 'vue-router'
import About from '../components/About'
import Home from '../components/Home'
//创建并暴露一个路由器
export default new VueRouter({
routes:{
{
path:'/about'
component:'About'
},
{
path:'/home'
component:'Home'
},
}
})


在main.js中需要
import vueResource from 'vue-route'
还要引入路由器js文件
import router from './router'

Vue.use(VueRouter)
new Vue中
增添路由实例
router:router



在App.vue中
vue中借助router-link实现路由的切换
<router-link class='xxxx' to="/about"> </router-link>

属性 active-class="" 当前组件被选中时候 调用的函数
更改路径
指定组件的呈现位置
<router-view></router-view> //里边什么都不用写

CSDN App 扫码分享
分享
3
2
打赏
  • 复制链接
  • 举报
下一条:
三哈想保持到月底
立即登录