父组件中的点击跳转:

     <ul class="insurance-entry clearfloat">
<li v-link="{name:'productlist',params:{id:1}}">1</li>
<li v-link="{name:'productlist',params:{id:2}}">2</li>
<li v-link="{name:'productlist',params:{id:3}}">3</li>
<li v-link="{name:'productlist',params:{id:4}}">4</li>
<li v-link="{name:'productlist',params:{id:5}}">5</li>
</ul>

在路由中定义子组件的时候

'/index/productlist/:id':{
//产品列表
name : 'productlist',
component: function (resolve) {
require(['./vue/productlist.vue'],resolve)
}
},

这里一定声明加id('/:id')。

这里的params就是子组件的id可以算作一个参数,在子组件中:

        route : {
data (transition){
this.articleId = transition.to.params.id;
}
},

这里就获取了params.id,但是这里用到了vuex,正常传参还没搞明白。。。

vue.js 1中父组件跳到子组件中并传参让子组件显示不同的内容的更多相关文章

  1. zTree中父节点禁用,子节点可以用

    参考学习网址:http://www.treejs.cn/v3/main.php#_zTreeInfo zTree中父节点禁用,子节点可以用 axios.get('/base/unit/unittree ...

  2. vue.js 1.0中用v-for遍历出的li中的@click事件在移动端无效

    在vue.js使用v-for遍历出的li中的@click事件在移动端无效,在网页端可以执行,代码如下 <template> <div class="rating-secti ...

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

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

  4. 8、vue路由跳转 params与query 路由传参

    params与query router文件下index.js里面,是这么定义路由的: { path: '/about', name: 'About', component: About } 用quer ...

  5. Vue中this.$router.push参数获取(通过路由传参)【路由跳转的方法】

    传递参数的方法: 1.Params 由于动态路由也是传递params的,所以在 this.$router.push() 方法中 path不能和params一起使用,否则params将无效.需要用nam ...

  6. angular 中父元素ng-repeat后子元素ng-click失效

    在angular中使用ng-repeat后ng-click失效,今天在这个上面踩坑了.特此记录一下. 因为ng-repeat创造了新的SCOPE.如果要使用这个scope的话就必须使用$parent来 ...

  7. js 使某个页面不允许在子iframe中打开的解决办法

    在页面中添加如下js代码<script> if (window.parent !== window.self) { window.parent.location.reload(); }&l ...

  8. pom父工程dependencyManagement中的jar包在子工程中不写版本号无法引入的问题

    1.遇到的问题:  本人用的idea,然后在导入别人的项目的时候,pom文件中没有报错了,但是在maven栏目中jar包却一直报红,是因为我没写版本的原因吗?不对呀,我的父工程下已经写了springb ...

  9. Vue.js——60分钟组件快速入门

    一.组件简介 组件系统是Vue.js其中一个重要的概念,它提供了一种抽象,让我们可以使用独立可复用的小组件来构建大型应用,任意类型的应用界面都可以抽象为一个组件树: 那么什么是组件呢?组件可以扩展HT ...

随机推荐

  1. zenefits oa - sort integer array in lexographical order

    [ 12 | 2434 | 23 | 1 | 654 | 222 | 56 | 100000 ] Then the output should be: [ 1 | 100000 | 12 | 222 ...

  2. 关于 Record & TList 的一点吐槽

    需求是把record 保存在TList中,并可以随时改变TList中Items的各项值. 代码很简单: MyRec = record MyStr: string; constructor Create ...

  3. data process for large scale datasets

    Kmeans:   总体而言,速度(单线程): yael_kmeans > litekmeans ~ vl_kmeans 1.vl_kemans (win10 + matlab 15 + vs1 ...

  4. python 字符串技巧 from python cookbook

    所有数据进入程序中都只是一串字节 英文字符占一个字节 汉语是两个字节 一字节byte=8bit Unicode字符串为每种语言的每种字符设定了统一并且唯一的二进制编码 big = r'This is ...

  5. JDBC连接数据库演示

    今天重新学习了JDBC连接数据库,使用的数据库是Oracle,在运行前已经手动建立了一张t_user表,建表信息如下: create table t_user( card_id ) primary k ...

  6. Python selenium执行多个测试脚本时,浏览器多次打开登录账户

    当类里面定义了 setUp() 方法的时候,测试程序会在执行每条测试项前先调用此方法:同样地,在全部测试项执行完毕后,tearDown() 方法也会被调用. 所以当在setUp()中执行打开浏览器后, ...

  7. sublime 中文乱码

      一.安装Package Control 使用Sublime Text2首先就要安装Package Control,这样就能使用丰富的插件包了 (1)访问Package Control站点按照提示复 ...

  8. IIS 301 重定向 带参数链接

    做QQ的单点登陆,身后后发现,填写的是www.51laugh.cn,修改生效需要3天. 直接把根域做301调整,是目前的最佳解决方案. 1.建立一个新的站点,目录指定到任何一个空文件夹就好了.主机头绑 ...

  9. MySql分组函数-Group by与having理解

    注意:select 后的字段,必须要么包含在group by中,要么包含在having 后的聚合函数里. 1. GROUP BY 是分组查询, 一般 GROUP BY 是和聚合函数配合使用 group ...

  10. REGEX.C GNU 提取过滤数据

    今天被@SVCHAO  勾起兴趣来了.. 有把正则表达式兴趣捡起来了,试了下notepad++基本上语法倒是没有忘记,不过如果是用在嵌入式的方案的话,似乎还是有点费劲的. 先mark一个基础语法. 单 ...