<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <script src="../vue2.2.js"></script>

        <script src="../vue-router2.1.js"></script>

    </head>

    <body>

        <div id="app">

            <p>

                <router-link to="/user/01">QQ登录</router-link>

                <router-link to="/user/02">微信登录</router-link>

            </p>

            <router-view></router-view>

        </div>

        <script>

            /*一个路径参数使用冒号:标记.当匹配到一个路由时,参数值会被设置到this.$route.params,

                    可以在每个组件内使用.于是,我们可以更新User模板,输出当前的Id*/

            var User = {

                template: `<div>User {{$route.params.id}}</div>`

            }

            const router = new VueRouter({

                routes: [{

                    path: "/user/:id",

                    component: User

                }]

            })

            const vm = new Vue({

                router //router:router

            }).$mount("#app")

        </script>

    </body>

</html>

vue2.0 路由传参（router-link传过去）的更多相关文章

  1. vue2.0路由（跳转和传参）经典介绍

    声明式 <router-link :to="...">编程式router.push(...) router.push('home')                 / ...

  2. vue2.0路由写法、传参和嵌套

    前置知识请戳这里 vue-routerCDN地址:https://unpkg.com/vue-router@3.0.1/dist/vue-router.js vue-router下载地址:https: ...

  3. vue2.0路由

    现在用vue-cli搭建的环境里面vue-router是下载好的 vue2.0路由方式和以前也有些不同 没了了map和start方法 目录结构如上图 这里有三个文件,app.vue显示,main.js ...

  4. Apache ab测试工具使用方法（无参、get传参、post传参）(转)

    转自Apache ab测试工具使用方法(无参.get传参.post传参) Ab测试工具是apache自带的测试工具,具有简单易上手的特性,下面我总结一下我的使用方法,首先去官方下载apache程序包, ...

  5. python中函数的参数：必传参数（位置参数）、默认值参数、参数组传参、关键字传参

    1.必传参数也叫做位置参数,因为必填,也必须对应位置 2.默认值参数如上图的word 3.参数组参数:传进去的是0个.或多个value的形式,,,和位置参数有点像,只传value值,但是没有限制个数 ...

  6. SpringCloud：feign对象传参和普通传参及遇到的坑

    对象传参: #使用@RequestBody来指定传参对象 @RequestMapping(value = "/v2/matterCode/genCode", method = Re ...

  7. [ 随手记6 ] C/C++ 形参、实参、按值传参、指针传参、引用传参

    个人原创: 1. 形参:形式上的参数,一般多在函数声明.函数定义的参数上: 2. 实参:实体参数,有实际的值,在运算上被循环使用的值: 3. 按值传参:按值,就是把实际的值传给函数内部: 4. 指针传 ...

  8. Java传参都是传引用变量的副本

    最近做练习时碰到一个问题,Java到底是怎样传参的,经过查资料与实验,我发现Java传参都是传引用变量的副本值. 1 Java中的引用变量 1.1 字面值引用变量:即基本数据类型的引用变量 ,如 in ...

  9. vue路由传参及组件传参和组件方法调用

    VUE路由和组件传参 第一种vue自带的路由传参的三种基本方式 1.通过name :id传参 子组件通过$route.name接收参数 { path: '/particulars/:id', name ...

  10. vue2.0路由-路由嵌套

    vue一个重要的方面就是路由,下面是自己写的一个路由的例子: 1.引入依赖库就不必再说 2.创建组件 两种写法 第一种:间接 <template id="home"> ...

随机推荐

  1. 2016-2017 ACM-ICPC Southwestern European Regional Programming Contest (SWERC 2016) E.Passwords AC自动机+dp

    题目链接:点这里 题意: 让你构造一个长度范围在[A,B]之间 字符串(大小写字母,数字),问你有多少种方案 需要满足条件一下: 1:构成串中至少包含一个数字,一个大写字母,一个小写字母:   2:不 ...

  2. Common non-standard response fields

    https://en.wikipedia.org/wiki/List_of_HTTP_header_fields#cite_note-52 Common non-standard response f ...

  3. maven工具使用

    一.工具安装: 所需工具 : JDK 1.8Maven 3.3.3 1.安装JDK 和 JAVA_HOME 2.添加 M2_HOME 和 MAVEN_HOME 3.添加到环境变量 - PATH 4.验 ...

  4. linux网络socket 接口转

    linux网络socket 接口 1.socket函数:一个进程必须做的第一件事就是调用socket函数获得一个文件描述符. ------------------------------------- ...

  5. YTU 2895: H--唱歌的鸟儿

    2895: H--唱歌的鸟儿 时间限制: 1 Sec  内存限制: 128 MB 提交: 26  解决: 10 题目描述 烟大东门有一棵大杨树,树上经常会有很多鸟儿飞来飞去.春天来了,学生物的小姜发现 ...

  6. 谁动了我的cpu——oprofile使用札记

    引言 cpu无端占用高?应用程序响应慢?苦于没有分析的工具? oprofile利用cpu硬件层面提供的性能计数器(performance counter),通过计数采样,帮助我们从进程.函数.代码层面 ...

  7. Bootstrap中的各种下拉菜单

    @*基本下拉菜单与按钮下拉菜单的样式完全一致.不过,基本的下拉菜单使用<div class="dropdown">包裹,所有要换行.而按钮式下拉菜单<div cl ...

  8. Luogu P1991 无线通讯网 【最小生成树】

    题目描述 国防部计划用无线网络连接若干个边防哨所.2 种不同的通讯技术用来搭建无线网络: 每个边防哨所都要配备无线电收发器:有一些哨所还可以增配卫星电话. 任意两个配备了一条卫星电话线路的哨所(两边都 ...

  9. 设置mysql 定时备份任务

    1 修改配置文件  /etc/my.conf (为了命令 mysqldump能省略输入密码执行,mysql5.5 之后已经不建议控制台直接输入密码的方式) 增加如下配置 [client]host=lo ...

  10. ______________从时间超限到800ms 到200ms——————2098

    分拆素数和 Time Limit: / MS (Java/Others) Memory Limit: / K (Java/Others) Total Submission(s): Accepted S ...