https://router.vuejs.org/

vue路由配置:

1.安装

npm install vue-router --save / cnpm install vue-router --save

2、引入并 Vue.use(VueRouter) (main.js)

import VueRouter from 'vue-router'

Vue.use(VueRouter)

3、配置路由

1、创建组件 引入组件

2、定义路由 (建议复制s)

const routes = [
{ path: '/foo', component: Foo },
{ path: '/bar', component: Bar },
{ path: '*', redirect: '/home' } /*默认跳转路由*/
]

3、实例化VueRouter

const router = new VueRouter({
routes // (缩写)相当于 routes: routes
})

4、挂载

new Vue({
el: '#app',
router,
render: h => h(App)
})

5 、根组件的模板里面放上这句话 <router-view></router-view>

6、路由跳转
<router-link to="/foo">Go to Foo</router-link>
<router-link to="/bar">Go to Bar</router-link>

vue 路由 以及默认路由跳转的更多相关文章

  1. WebApi-2 自定义路由与默认路由

    向Web API添加路由 public static void Register(HttpConfiguration config) { //// Web API 配置和服务 //// 将 Web A ...

  2. Vue中的路由 以及默认路由跳转

    https://router.vuejs.org/ vue路由配置: 1.安装 npm install vue-router --save / cnpm install vue-router --sa ...

  3. 在ensp上静态路由以及默认路由基本配置

    原理 实验模拟 实验拓扑 实验参数 测试连通性 两台PCping一下,发现超时 为什么呢我们可以看一下这个路由表,发现没有网段为20的信息,所以我们要加上 加入当访问地址为20网段时,设置下一跳路由器 ...

  4. IT菜鸟之路由器基础配置(静态、动态、默认路由)

    路由器:连接不同网段的设备 企业级路由和家用级路由的区别: 待机数量不同(待机量) 待机量:同时接通的终端设备的数量 待机量的值越高,路由的性能越好 别墅级路由,表示信号好,和性能无关 交换机:背板带 ...

  5. CCNP路由实验之八 路由重公布

     CCNP路由实验之八 路由重公布 在前面几个实验,已经学习了静态路由和动态路由.如今,我们要掌握怎样使它们在一个网络中融合,即路由重公布. 使用出站口作为静态路由 0 使用下一跳地址作为静态路由 ...

  6. IP路由__静态路由

    1.静态路由的优缺点: 优点:对于路由器的CPU没有管理性开销,它意味着如果你不使用动态路由选择的话,你可能应该购买更为便宜的路由器.在路由器之间没有带宽占用,它意味着在WAN链接中你可以节省更多的钱 ...

  7. 华为eNSP路由交换-静态路由

    静态路由 一. 静态路由及默认路由基本配置 1.1实验内容 在由三台路由器所组成的简单网络中,R1和R3各连着一台PC,现在要求能够实现PC-1和PC-2之间的通信.本实验将通过配置基本的静态路由和默 ...

  8. 每天一点点之vue框架开发 - vue-router路由进阶(路由别名、跳转、默认路由、二级路由、路由守卫)

    路由别名   在main.js中的路由中添加name来创建别名 const routes = [ {path:'/footer',name:footerLink,component:Footer} ] ...

  9. 057——VUE中vue-router之路由参数默认值的设置

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. 剑指offer-反向遍历链表-栈和递归2种方法(一次性跑通)

  2. postgresql的基本使用,以及数据库的备份与恢复

    安装过程没什么说的,基本是一直下一步下一步,就是中间需要输入密码之类的 postgresql使用模式是数据库表,视图等的集合,我们可以自荐创建一个schema 创建表的方法 进入sql命令行窗口的方法 ...

  3. Object Relational Mapping(ORM)

    Object Relational Mapping(ORM) ORM介绍 ORM概念 对象关系映射(Object Relational Mapping,简称ORM)模式是一种为了解决面向对象与关系数据 ...

  4. src-d engine 强大的git 历史分析工具

    src-d engine 包含了Babelfish ,同时可以看作是Babelfish 的升级版本,我们可以使用sql 进行代码分析 备注: 注意运行的时候需要容器支持 使用 安装docker   参 ...

  5. 使用InternalsVisibleToAttribute给assembly添加“友元assembly”特性遭遇"强签名"

    一.如何让Intenal成员暴露给另一个程序集 我们知道Modifier为Internal的类型成员仅限于当前程序集能够访问,但是在某些情况下,我们希望将它们暴露给另一个程序集.比较典型的应用场景包括 ...

  6. 嵌入式linux查看磁盘占用情况df -h

  7. DefinePlugin插件

    这个插件允许你创建全局常量用于编译时解析.如果设置mode:"production",webpack默认会设置"process.env.NODE_ENV": J ...

  8. 什么是 PWA?

    出处:https://segmentfault.com/a/1190000012353473

  9. gitlab 可以上传代码,但是 不能 上传 tag 问题

    原因是 puttygen 生成的 公私钥不能用, 换 git 私钥后 ( 默认不能导入到 pageant  ),再用 puttygen 转一次就可以了.

  10. Linux(CentOS7.0)下 C访问MySQL (转)

    按语:      最近项目在云服务器上 centos6.8,安装了mysql5.5.39 server和client,但C连接不知所措: 后在官网下载了 devel.share .share-comp ...