A:router路由配置

 1 export default new Router({
2 routes: [
3 {
4 path: '/home',
5 name: 'Home',
6 component: Home,
7 children:[
8 {path:'home1',component:Home1},
9 {path:'home2',component:Home2},
10 {path:'home3',component:Home3},
11 {path:'home4',component:Home4},
12 ],
13 },{
14 path: '/detail',
15 name: 'detail',
16 component:Detail
17 },{
18 path:'/',redirect:'/home/home1'
19 }
20 ],
21 linkActiveClass:'ac'
22 })

B.template内部

<li v-for="data in tuijiaList.playlists">
<router-link :to="{path:'/detail',query:{id:data.id}}" >
<span>{{data.playCount}}</span><i><img :src="data.coverImgUrl"></i>
<p>{{data.name}}</p>
</router-link>
</li>
C:在detail页面上怎么得到id 值?
 this.$route.query.id;
 

vue-router2.0 初学--动态赋值的更多相关文章

  1. Vue 2.0初学后个人总结及分享

    摘要:最近在上海找工作,发现Vue前景还不错,于是就打算先学习一下(之前了解过,但是一直没提到日程上)这篇随笔当是为了自己学习之后,做一个小的阶段性总结.希望本文的内容对于刚开始接触vue的朋友们有点 ...

  2. vue关于img src动态赋值问题

    解决方法: 加个require()就可以了 <img :src="require('../assets/images/'+imgsrc+'.png')"/>

  3. vue 2.0 vue.set的使用方法

    这里我定义了一个列表数据,我将通过三个不同的按钮来控制列表数据. 首先在列表中动态新增一条数据: <!DOCTYPE html><html><head lang=&quo ...

  4. Highcharts动态赋值学习

    最近老大让做项目中的统计图表功能,需要使用highcharts这个插件,弄出来了两种类型的图表动态赋值的实现,首先贴上中文网的官网和api地址,使用这个英语不好的同学肯定会用到的: 中文网官网:htt ...

  5. Jquery为下拉列表动态赋值与取值,取索引

    接触前端也不久对jquery用的也只是皮毛,写过去感觉能复用的发出来,大家指点下 1.下拉列表动态赋值 function initddlYear() { var mydate = new Date() ...

  6. javascript如何解析json对javascript如何解析json对象并动态赋值到select列表象并动态赋值到select列表

    原文 javascript如何解析json对象并动态赋值到select列表 JSON(JavaScriptObject Notation)一种简单的数据格式,比xml更轻巧.JSON是JavaScri ...

  7. Vue 2.0基础语法:系统指令

    本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. Vue初体验 新建一个空的项目,引入vue.js文件.写如下代码: &l ...

  8. 十八、泛型 l 注解 l Servlet3.0 l 动态代理 l 类加载器基础加强

    l 泛型 l 注解 l Servlet3.0 l 动态代理 l 类加载器 泛型 1 回顾泛型类 泛型类:具有一个或多个泛型变量的类被称之为泛型类. public class A<T> { ...

  9. vue 实现tab切换动态加载不同的组件

    vue 实现tab切换动态加载不同的组件 使用vue中的is特性来加载不同的组件.具体看如下代码:这个功能对于vue比较复杂的页面可以使用上,可以把一个页面的功能拆分出来,使代码更简单.使用方式具体看 ...

随机推荐

  1. 如何决定Web应用的线程池大小

    线程池(Thread Pool)在Web应用中线程池的大小决定了在任何一个时间点应用可以处理请求的并发数.如果一个系统收到的请求数超过了线程池的大小,那么超出的请求要么进入等待队列要么被拒绝.请注意, ...

  2. PyQt5系列教程

    PyQt5系列教程(一)Mac OS X下搭建Python3.5.1+PyQt5开发环境PyQt5系列教程(二)利用QtDesigner设计UI界面PyQt5系列教程(三)用py2exe进行程序打包P ...

  3. margin-top失效

    span标签是行类元素,只能margin-left,right 解决办法: 将span标签改为块级标签

  4. python学习之RabbitMQ-----消息队列

    RabbitMQ队列 首先我们在讲rabbitMQ之前我们要说一下python里的queue:二者干的事情是一样的,都是队列,用于传递消息 在python的queue中有两个一个是线程queue,一个 ...

  5. 0_Simple__simpleMPI

    MPI 的简单使用 ▶ 源代码.主机根结点生成随机数组,发布副本到各结点(例子用孩子使用了一个结点),分别使用 GPU 求平方根并求和,然后根结点使用 MPI 回收各节点的计算结果,规约求和后除以数组 ...

  6. Declaration terminated incorrectly 讨厌 这样就不可以了

    #include "vcl.fctreeview.hpp"#include "RM_Class.hpp"#include "RM_Common.hpp ...

  7. 边框(border)宽度样式颜色 和基本属性

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

  8. Maven 异常

    Archive for required library: '*****org/javassist/javassist/3.21.0-GA/javassist-3.21.0-GA.jar' in pr ...

  9. C++中怎么创建类对象

    在C++里,有两种方法创建对象:方法一:ClassName object(param);这样就声明了一个ClassName类型的object对象,C++会为它分配足够的存放对象所有成员的存储空间.注意 ...

  10. InnoDB FULLTEXT

    1.概要 InnoDB引擎对FULLTEXT索引的支持是MySQL5.6新引入的特性,之前只有MyISAM引擎支持FULLTEXT索引.对于FULLTEXT索引的内容可以使用MATCH()…AGAIN ...