知识点:vue路由传递参数,第二个页面(A.B页面)拿到参数,使用参数

方法一:使用 <router-link :to="{name:'edithospital',params:{hid:101}}">编辑</router-link>

1.在路由配置中添加

{
      name:'edithospital',             \\路由的名字
      path: '/edithospital/:hid',      \\路由中添加要传递的参数:hid
      component: resolve => require(['../components/page/hospital/EditHospital.vue'], resolve)
}

. A页面

<router-link :to="{name:'edithospital',params:{hid:101}}">编辑</router-link> \\101是变量,可根据实际情况改变

\\name是路由的名字,params是传递的参数

3. B页面 <template><template>中添加

{{$route.params.hid}}     // 101

方法二:<button @click="handleEdit(scope.$index, scope.row)"> 编辑</button>

1.同上

2.A页面

handleEdit(index, row) {
this.$router.push({
name: 'edithospital',
params: {
hid: row.hid //row.hid为变量
}
})
}, 3.同上
--------------------------------------------------------------------------------------------------------------------------------------
效果参考:
可参考:1.https://segmentfault.com/q/1010000009749320
2.http://blog.csdn.net/wy01272454/article/details/77869442?locationNum=7&fps=1

vue.js中路由传递参数的更多相关文章

  1. Vue 给子组件传递参数

    Vue 给子组件传递参数 首先看个例子吧 原文 html <div class="container" id="app"> <div clas ...

  2. vue.js 中双向绑定的实现---初级

    1. 1 我们看到的变量,其实都不是独立的,它们都是windows对象上的属性 <!DOCTYPE html> <html lang="en"> <h ...

  3. vue.js 中 data, prop, computed, method,watch 介绍

    vue.js 中 data, prop, computed, method,watch 介绍 data, prop, computed, method 的区别 类型 加载顺序 加载时间 写法 作用 备 ...

  4. JS中URL编码参数(UrlEncode)

    JS中URL编码参数(UrlEncode) 网上有很多文字作品写涉及在JS中呈现类似UrlEncode功能时都是自定义参数来呈现,其实JS中本身就有那样的参数.参数parameter由于用类似URL的 ...

  5. vue.js中,input和textarea上的v-model指令到底做了什么?

    v-model是 vue.js 中用于在表单表单元素上创建双向数据绑定,它的本质只是一个语法糖,在单向数据绑定的基础上,增加了监听用户输入事件并更新数据的功能: 对,它本质上只是一个语法糖,但到底是一 ...

  6. 【2017-06-27】Js中获取地址栏参数、Js中字符串截取

    一.Js中获取地址栏参数 //从地址栏获取想要的参数 function GetQueryString(name) { var reg = new RegExp("(^|&)" ...

  7. 实例分析Vue.js中 computed和methods不同机制

    在vue.js中,有methods和computed两种方式来动态当作方法来用的 1.首先最明显的不同 就是调用的时候,methods要加上() 2.我们可以使用 methods 来替代 comput ...

  8. Vue.js中使用select选择下拉框

    在Vue.js中使用select选择下拉框有两种方法: 第一种: Add.html: <select v-model="sysNotice.noticeType" id=&q ...

  9. 浅析Vue.js 中的条件渲染指令

    1 应用于单个元素 Vue.js 中的条件渲染指令可以根据表达式的值,来决定在 DOM 中是渲染还是销毁元素或组件. html: <div id="app"> < ...

随机推荐

  1. PHP 常用资源

    Apache:http://httpd.apache.org/download.cgi PHP:http://windows.php.net/download#php-5.6 MySQL:http:/ ...

  2. window.navigator.userAgent $_SERVER['HTTP_USER_AGENT']

    wjs php返回结果一致 <script> !function () { var UA = window.navigator.userAgent, docEl = document.do ...

  3. 关于VFS文件系统中的superblock、inode、d_entry和file数据结构

  4. SSH整合中,使用父action重构子类action类.(在父类中获取子类中的泛型对象)

    import java.lang.reflect.ParameterizedType; import java.lang.reflect.Type; import com.opensymphony.x ...

  5. EIT: where is it now and what lies ahead?

    EIT: where is it now and what lies ahead? Electrical impedance tomography (EIT) is an emerging clini ...

  6. Spring数据访问和事务

    1.模型 2.解耦 3.实现 3.1 核心接口 3.2 代码分析 3.2.1 事务管理 3.2.2 数据访问 4.使用 4.1 编程模式 4.2 配置模式 4.2.1 声明式配置方式 4.2.2 注解 ...

  7. 针对Quant的Python快速入门指南

    作者:用Python的交易员 (原创文章,转载请注明出处) 最近有越来越多的朋友在知乎或者QQ上问我如何学习入门Python,就目前需求来看,我需要写这么一篇指南. 针对整个vn.py框架的学习,整体 ...

  8. python - 用户交互/数据类型/格式化输出/运算符/流程控制单双多分支

    python:用户交互: 等用户输入,做反应: username=input("username:")password=input("password:")pr ...

  9. 安装canal

    一.安装前准备 配置Mysql: [mysqld] log-bin=mysql-bin #添加这一行就ok binlog-format=ROW #选择row模式 server_id=1 #配置mysq ...

  10. 01-开始使用django(全、简)

    目录 (一)创建项目 1.生成django默认目录 2.创建应用目录 3.安装应用 4.配置使用mysql数据库 5.运行轻量级web服务器,预览 (二)设计模型 1.在models.py中定义模型类 ...