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"> < ...
随机推荐
- mysql 创建函数ERROR 1418 (HY000): This function has none of DETERMINISTIC, NO SQL, or READS SQL DATA in its declaration and binary logging is enabled (you *might* want to use the less safe log_bin_trust_f
mysql 创建函数的时候 报错 ERROR 1418 (HY000): This function has none of DETERMINISTIC, NO SQL, or READS SQL D ...
- Python3: Command not found(Mac OS)
1. 第一步:查看以下路径是否安装有 Python 3.x # 打开以下目录, 版本号有可能不同 cd /usr/local/Cellar/python/3.5.2_3/bin # 查看当前目录的内容 ...
- 剑指Offer——数组中重复的数字
题目描述: 在一个长度为n的数组里的所有数字都在0到n-1的范围内. 数组中某些数字是重复的,但不知道有几个数字是重复的.也不知道每个数字重复几次.请找出数组中任意一个重复的数字. 例如,如果输入长度 ...
- ubuntu安装Jenkins指导
乌班图安装Jenkins指导 安装Java :apt install default-jre 参考:https://www.cnblogs.com/xionggeclub/p/7117004.html ...
- 0604-Zuul构建API Gateway-Zuul的回退
一.概述 参看地址:https://cloud.spring.io/spring-cloud-static/Edgware.SR3/single/spring-cloud.html#hystrix-f ...
- spring MVC学习(二)---配置相关的东西
1.在上一节中我们提到过每一个DispatcherServlet都会有一个上下文 (WebApplictionContext),并且继承了这些上下文中的bean,其中以一些"特殊" ...
- spring中的缓存--Caching
1.spring从3.1开始支持缓存功能.spring 自带的缓存机制它只在方法上起作用,对于你使用其他持久化层的框架来讲,是没有影响的,相对来讲这种缓存方式还是不错的选择. 2.提供缓存的接口:or ...
- php array_mutisort
PHP中array_multisort可以用来一次对多个数组进行排序,或者根据某一维或多维对多维数组进行排序. 关联(string)键名保持不变,但数字键名会被重新索引. 输入数组被当成一个表的列并以 ...
- php注册审查
思路 用户注册后就有该条用户记录,你对用户表设一个“审核状态”字段,默认值设为“未审核”,然后你写几句审核代码做成一个功能,按照你们的意愿若审核通过你把审核状态改为“已审核”就行了.用户想进行各种操作 ...
- MySql—模糊查询
实例: SQL模糊查询,使用like比较关键字,加上SQL里的通配符,请参考以下: 1.LIKE 'Mc%' 将搜索以字母 Mc 开头的所有字符串(如 McBadden). 2.LIKE '%in ...