vue-router

对于vue这个前端框架,构建单页面是十分重要的,对于单页面肯定是少不了路由,vue-router是vue官方提供的一个路由框架,下面简单的说说

1.使用node安装:npm install vue-router

2.对于一个项目需要使用Vue.use(VueRouter),但是这个前提是需要引入这个模块import VueRouter from "vue-router"

3.使用需要将路径与组件联系起来,需要进行定义const router = {'path': '对应的路径',‘component’:模板}

4.创建实例,const router = new VueRouter({router}),对于在转化单页面的时,需要添加的类的对象是linkActiveClass,在实例里进行添加

5.创建和挂载根实例  const  app = new Vue(router).$mount('#app');  需要将router进行挂载


上面是js中的内容,下面是组件的内容

1.需要用router-link这个标签进行导航 to链接到指定的组件  <router-link to=''></router-link>

2.router-link只是导航的作用,下面需要的是找到出口,将路由的内容渲染在里,标签是router-view


案例在https://github.com/liuian1946/elema-vue中的main.js和App.vue中

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值