Vue Router

用 Vue.js + vue-router 创建单页应用,是非常简单的。使用 Vue.js ,我们已经可以通过组合组件来组成应用程序,当你要把 vue-router 添加进来,我们需要做的是,将组件(components)映射到路由(routes),然后告诉 vue-router 在哪里渲染它们。

安装

可以通过cdn或者直接下载的方式,当然,我个人比较喜欢用过模块化npm安装,如果是在一个模块化的打包系统中,必须显式地通过 Vue.use() 来安装 :

import Vue from 'vue'
import Router from 'vue-router'
import Teacher from '@/BTeacher'
Vue.use(Router);

首先引入vue以及router,(@指的是vue-cli里的src路径)然后引入一个组件,接着去配置Router

export default new Router({
  routes: [

    {
      path: '/name',       //这里指明跳转路径,通常写import name form "...的name
      name: 'main',
      component: Teacher
    }]
)}

new Router({ }) 创建一个Router对象,path代表的是路径,name 里是一个唯一的制定标识符
component 放的是组件,
接着就能够调用这个路由了,通过 this.$router.push({path: '路径' +?id}),路径后面可以添加一个id 来指定不同的跳转,这里
path 后的路径名既是网址后跟的路由名称。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1路由,其实就是指向的意思,当我点击页面上的home按钮时,页面中就要显示home的内容,如果点击页面上的abou...
    你好陌生人丶阅读 5,552评论 0 6
  • 近几天里,朋友圈,支付宝圈里都被各种花式求福的信息占据了,无疑避免,自己也加入了集五福的阵营里,拿着手机把家...
    悠莜时光阅读 3,552评论 0 1
  • 那天,是我第一次登上泰山。 那天,是我对这个城市的游览。 那天,是我对毅力的考验。 泰山,五岳独尊。 我们在六个小...
    随大阅读 2,350评论 0 1
  • 假如我是窦唯 我绝对不会离开黑豹乐队 我会扛着乐队 向更高更远的地方走去 假如我是窦唯 我绝对不会出轨高原 这样就...
    会疼这思念阅读 1,553评论 0 4
  • 转眼间 已奔三 新欢旧爱 未曾多 知己两三只 人生路 不得闲 妹子妹子 伴我行 片刻不消停 浅对白 深伤害 时过伤...
    地球很危险T_T阅读 1,248评论 1 1