vue.js中路由传递参数
知识点: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中路由传递参数的更多相关文章
- Vue 给子组件传递参数
Vue 给子组件传递参数 首先看个例子吧 原文 html <div class="container" id="app"> <div clas ...
- vue.js 中双向绑定的实现---初级
1. 1 我们看到的变量,其实都不是独立的,它们都是windows对象上的属性 <!DOCTYPE html> <html lang="en"> <h ...
- vue.js 中 data, prop, computed, method,watch 介绍
vue.js 中 data, prop, computed, method,watch 介绍 data, prop, computed, method 的区别 类型 加载顺序 加载时间 写法 作用 备 ...
- JS中URL编码参数(UrlEncode)
JS中URL编码参数(UrlEncode) 网上有很多文字作品写涉及在JS中呈现类似UrlEncode功能时都是自定义参数来呈现,其实JS中本身就有那样的参数.参数parameter由于用类似URL的 ...
- vue.js中,input和textarea上的v-model指令到底做了什么?
v-model是 vue.js 中用于在表单表单元素上创建双向数据绑定,它的本质只是一个语法糖,在单向数据绑定的基础上,增加了监听用户输入事件并更新数据的功能: 对,它本质上只是一个语法糖,但到底是一 ...
- 【2017-06-27】Js中获取地址栏参数、Js中字符串截取
一.Js中获取地址栏参数 //从地址栏获取想要的参数 function GetQueryString(name) { var reg = new RegExp("(^|&)" ...
- 实例分析Vue.js中 computed和methods不同机制
在vue.js中,有methods和computed两种方式来动态当作方法来用的 1.首先最明显的不同 就是调用的时候,methods要加上() 2.我们可以使用 methods 来替代 comput ...
- Vue.js中使用select选择下拉框
在Vue.js中使用select选择下拉框有两种方法: 第一种: Add.html: <select v-model="sysNotice.noticeType" id=&q ...
- 浅析Vue.js 中的条件渲染指令
1 应用于单个元素 Vue.js 中的条件渲染指令可以根据表达式的值,来决定在 DOM 中是渲染还是销毁元素或组件. html: <div id="app"> < ...
随机推荐
- Net Core MVC6 RC2 启动过程分析
入口程序 如果做过Web之外开发的人,应该记得这个是标准的Console或者Winform的入口.为什么会这样呢?.NET Web Development and Tools Blog ASP.NET ...
- python基础-第七篇-7.3反射
定义 反射是根据字符串的形式去对操作其成员 了解反射前,我先看看内置方法__import__,还记得这个内置方法吗? __import__ 用于以字符串的形式导入模块 inp = input('请输 ...
- Pandas 如何通过获取双(多)重索引获取指定行DataFrame数据
图片看不清楚的话,可以右键选择:“在新标签页中打开图片(I)” 参数 df.loc[(a,b),c]中第一个参数元组为索引内容,a为level0索引对应的内容,b为level1索引对应的内容 因为df ...
- python学习笔记——字符串
类方法string.upper(str)需要引入string模块,实例方法str.upper()不需要引入string模块 无与伦比的列表解析功能 # coding=utf-8 # 列表解析 prin ...
- 正则表达式验证合法的IP地址
IPv4地址 最初设计互联网络时,为了便于寻址和层次化构造网络,每个IP地址包括两个标识码(ID),即网络ID和主机ID.同一个物理网络上的所有主机都使用同一个网络ID,网络上的一个主机(包括网络上的 ...
- VMware 虚拟机 Ubuntu 不能全屏问题
在刚安装完ubuntu后,屏幕不能全屏显示,此时: 1.安装VMware Tools 步骤: 1.1 进入ubuntu系统后,点击虚拟机上的[虚拟机]->[安装 vmware tools ...
- django URL的补充 默认值 传多个参数
url 后面还可以加上默认值 默认值 url(r'^index/', views.index, {'name': 'root'}), urls.py url对应关系 from django.conf. ...
- Java基础—输入输出流
流的概念 在Java中,流是从源到目的地的字节的有序序列.Java中有两种基本的流——输入流(InputStream)和输出流(OutputStream). 根据流相对于程序的另一个端点的不同,分为节 ...
- 产品固件(系统)升级——curl/wget
1.文件下载指令应用 支持断点续传 curl -C - -O "https://curl.haxx.se/download/archeology/curl-7.58.0.tar.gz&quo ...
- string与CString对比
string是标准C++库中的字符串类,CString是在Windows开发环境下常用的字符串类,CString目前已从MFC中分离出来可以单独使用,只需包含atlstr.h即可. 相比string, ...