Vue router中携带参数与获取参数

  1. 携带参数

    1. query方式,就是?+&结构,例如/login?id=1

      <router-link :to="{ name:'login',query:{id:1} }">登录</router-link>
      this.$router.push({
      path: '/login',
      query:{
      id:id,
      }
      })
    2. Params方式,也就是类似于restful风格,例如/register/San

      <router-link :to="{ name:'register',params:{'name':'San'} }">注册</router-link>
      this.$router.push({
      name: 'monitor',
      params:{
      id:id,
      }
      })

      这种方式(restful风格)配置的路由,要在配置路由的时候格外注意一点

      var router = new VueRouter({
      routes:[
      {name:'login',path:'/login',component:Login},
      {name:'register',path:'/register',component:Register}
      ]
      })
  2. 获取参数

    1. query方式

      this.$route.query.id
    2. params(restful)

      this.$route.params.name

Vue router中携带参数与获取参数的更多相关文章

  1. Node.js中的express框架获取参数

    express获取参数有三种方法: req.query  适合 http://localhost:3000/form?num=8888 req.body   适合http://localhost:30 ...

  2. angular4.0路由传递参数、获取参数最nice的写法

    研究ng4的官网,终于找到了我想要的方法.我想要的结果是用'&'拼接参数传送,这样阅读上是最好的.否则很多'/'的拼接,容易混淆参数和组件名称.一般我们页面跳转传递参数都是这样的格式:http ...

  3. Spring MVC url提交参数和获取参数

    [转载:http://blog.csdn.net/mahoking] 普通URL提交参数         该格式url为:url.do?param1=mahc&param2=8888.00 需 ...

  4. 页面间传递前端请求参数和获取参数:Model model,HttpServletRequest request, ModelMap map参数使用与区别

    Model model, HttpServletRequest request, ModelMap map声明变量 一.下面的方法是需要将请求发过来的数据(或者说参数)传递到重定向的页面/转发的页面的 ...

  5. SpringMVC传递参数和获取参数以及返回数据

    1.传递form表单,参数接收到对象,name和对象属性对应上即可:   2.springmvc不能直接通过form表单传递多个对象的list集合,要么采用ajax传递,要么采用封装了list属性的b ...

  6. Vue 项目中 外部js 如何获取 vue 实例

    1.将main.js 中的 Vue 实例暴露出去 2.在外部js中导入main.js (    import vm from '../main' );

  7. vue router 中,children 中 path 为空字符串的路由,是默认打开的路由(包括在 el-tabs 中嵌套路由的情况)

    详见该页面的最后一个代码块:https://router.vuejs.org/zh/guide/essentials/nested-routes.html#%E5%B5%8C%E5%A5%97%E8% ...

  8. beanutils设置参数和获取参数

    public class Employee implements DynaBean  { private String  firstName="李";    private Str ...

  9. [Vue 牛刀小试]:第十二章 - 使用 Vue Router 实现 Vue 中的前端路由控制

    一.前言 前端路由是什么?如果你之前从事的是后端的工作,或者虽然有接触前端,但是并没有使用到单页面应用的话,这个概念对你来说还是会很陌生的.那么,为什么会在单页面应用中存在这么一个概念,以及,前端路由 ...

随机推荐

  1. 流媒体 Ubuntu部署srs、windows部署nginx

    一.获取项目//码云克隆git clone https://gitee.com/winlinvip/srs.oschina.git srs//githubgit clone https://githu ...

  2. WPF学习笔记一 依赖属性及其数据绑定

    本文想通过由浅入深的讲解让读者比较深的理解依赖属性.  首先,我们回顾一下依赖属性的发展历史. 最初,人们提出面向对象编程时,并没有属性这个说法,当时叫做成员变量.一个对象由成员变量和成员函数组成,如 ...

  3. 编译ffmpeg(第一次),实现JPG转MP4

    ffpmeg网址:http://ffmpeg.org/ ffmpegapi文档:http://ffmpeg.org/doxygen/trunk/index.html 因为这是JPG转MP4,所以不涉及 ...

  4. CNN的Pytorch实现(LeNet)

    CNN的Pytorch实现(LeNet)   上次写了一篇CNN的详解,可是累坏了老僧我.写完后拿给朋友看,朋友说你这Pytorch的实现方式对于新人来讲会很不友好,然后反问我说里面所有的细节你都明白 ...

  5. Vue.JS快速上手(组件间的通信)

    前言 Vue采用的是组件化思想,那么这些组件间是如何通信的呢?下面详细介绍一下. 所谓组件间通信,不单单是我们字面上理解的相互传递数据,这里还包括一个组件访问另一个组件的实例方法等,如父组件通过ref ...

  6. JavaScript——数组——数组长度

    JavaScript--数组--数组长度 JavaScript中的数组长度是可变的,可用赋值运算符改变数组大小,如果改变之后的数组的长度比原数组大,则新数组会在末尾补充相应数量的空位,空位上的数组元素 ...

  7. RHCS集群架构之mysql及共享存储iscsi

    server1 172.25.7.1(配置Nginx.ricci和luci) server2 172.25.7.2(Apache.iscsi) server3 172.25.7.3(Apache) s ...

  8. Mybatis-plus<二>通用CRUD,分页

    Mybatis-plus<二>通用CRUD,分页 与博客Mybatis-plus<一>为同一个Springboot项目. Demo GitHub下载地址:https://git ...

  9. 第三课:GDB 常用的调试命令概览

    先给出一个常用命令的列表,后面会结合具体的例子详细介绍每个命令的用法. 命令名称 命令缩写 命令说明 run r 运行一个程序 continue c 让暂停的程序继续运行 next n 运行到下一行 ...

  10. IDEA创建Maven项目做Java Web时无WEB-INF/classes的问题

    昨天开始学习Java Web中的Servlet,学到用IntelliJ IDEA创建Java Web项目时,跟着课程上老师的步骤一步步做,却发现运行时Servlet找不到.坑爹的是,练习建项目时,一模 ...