Vue.js路由跳转带参数到模板组件。
从SalesOrderQuery组件跳到SalesOrder组件,并且通过params属性携带数据。
handleClick(row) {
//alert(row.FSaleName);//获取该行FSaleName列的值。
this.$router.push({path:'/salesorder',
name:'salesorder',//必须带name属性,要不然参数传递不成功。
params:{
FSaleNo:row.FSaleNo,FSaleName:row.FSaleName,FSaleQty:row.FSaleQty,FSaleStatus:row.FSaleStatus,
FSaleAmount:row.FSaleAmount
}
});
//console.log(row);
}
SalesOrder组件获取params中的数据:
export default{
name:"SalesOrder",
data() {
return {
FSaleNo: this.$route.params.FSaleNo,
FSaleName:this.$route.params.FSaleName,
FSaleQty:this.$route.params.FSaleQty,
FSaleAmount:this.$route.params.FSaleAmount,//接收路由传过来的数据
FSaleAmount:'',
FSaleType:'',
FSaleStatus:this.$route.params.FSaleStatus,
options:[{
value: '70000',
label: '小样单'
},
{
value: '70001',
label: '版本单'
},
{
value: '70002',
label: '大货单'
}]
}
}
}
Vue.js路由跳转带参数到模板组件。的更多相关文章
- Vue.之.路由跳转
Vue.之.路由跳转 在进行项目开发的过程中,需要使用路由进行跳转.如下: // 不带有参数,在页面上跳转到别的页面 1. this.$router.push('/login/init'); // ...
- js上传文件带参数,并且,返回给前台文件路径,解析上传的xml文件,存储到数据库中
ajaxfileupload.js jQuery.extend({ createUploadIframe: function(id, uri) { //create frame var frameId ...
- vue.js路由参数简单实例讲解------简单易懂
vue中,我们构建单页面应用时候,一定必不可少用到vue-router vue-router 就是我们的路由,这个由vue官方提供的插件 首先在我们项目中安装vue-router路由依赖 第一种,我们 ...
- vue设置路由跳转参数,以及接收参数
最近做Vue项目,遇到了一个路由跳转问题:首页要跳转到项目页指定的Tab选项卡项,一开始总是跳到默认项.解决方法如下: 在跳转链接处设置了路由跳转参数,如下: <router-link :to ...
- vue二级路由跳转后外部引入js失效问题解决方案
vue路由可以通过children嵌套,于是可以形成二级路由等等... 案例如下: routes: [ { path: '/', name: 'dy', component: dy, children ...
- Vue编程式路由跳转传递参数
Vue 有时在路由跳转时需要用到一些原页面里的数据,用以下方法: 1.在跳转页的方法里写下query参数 TableChange(scope){ this.$router.push({ path:'d ...
- vue,下级页面刷新导致路由跳转带过来的数据消失的解决方法
if(typeof(this.$route.query.result)=='string'){ //刷新时走这 }else{ //正常路由跳转过来后就把数据塞到 localStorage let ob ...
- Vue.js - 路由 vue-router 的使用详解2(参数传递)
一.使用冒号(:)的形式传递参数 1,路由列表的参数设置 (1)路由列表的 path 是可以带参数的,我们在路由配置文件(router/index.js)里以冒号的形式设置参数. (2)下面样例代码中 ...
- Vue.js路由
有时候,我们在用vue的时候会有这样的需求,比如一个管理系统,点了左边的菜单栏,右边跳转到一个新的页面中,而且刷新的时候还会停留在原来打开的页面. 又或者,一个页面中几个不同的画面来回点击切换,这两种 ...
随机推荐
- nhibernate 3.x新特性
http://www.360doc.com/content/14/0226/17/9316347_355904008.shtml
- MQTT协议实现Eclipse Paho学习总结
MQTT协议实现Eclipse Paho学习总结 摘自:https://www.cnblogs.com/yfliufei/p/4383852.html 2015-04-01 14:57 by 辣椒酱, ...
- OBD Problem Vehicles
This page contains a list of vehicles that are known to be non-compliant with OBD-II in one way or a ...
- HDU 6097 Mindis (计算几何)
题意:给一个圆C和圆心O,P.Q是圆上或圆内到圆心距离相等的两个点,在圆上取一点D,求|PD| + |QD|的最小值 析:首先这个题是可以用三分过的,不过也太,.... 官方题解: 很不幸不总是中垂线 ...
- CodeForces 690D1 The Wall (easy) (判断连通块的数量)
题意:给定一个图,问你有几个连通块. 析:不用说了,最简单的DFS. 代码如下: #include <bits/stdc++.h> using namespace std; const i ...
- javascript的事件冒泡【转】
出处:http://www.cnblogs.com/sanshi/archive/2009/02/18/1393165.html (感谢三生石上) 这是一个基础性的文章,使用Javascript观察D ...
- Lua的文件IO操作
Lua 标准库 - 输入输出处理(input and output facilities) 转载于:http://blog.csdn.net/duanxuyun 文本Tag: Lua [IT168 技 ...
- 编写高质量代码改善C#程序的157个建议——建议82:Parallel简化但不等同于Task默认行为
建议82:Parallel简化但不等同于Task默认行为 建议81说到了Parallel的使用方法,不知道大家是否注意到文中使用的字眼:在同步状态下简化了Task的使用.也就是说,在运行Paralle ...
- C++语言运算符的功能、优先级和结合性
优先级 运算符 名称或含义 使用形式 结合方向 说明 1 [] 数组下标 数组名[常量表达式] 左到右 () 圆括号 (表达式)/函数名(形参表) . 成员选择(对象) 对象.成员名 -& ...
- leetcode 反转字符串
请编写一个函数,其功能是将输入的字符串反转过来. 示例: 输入:s = "hello" 返回:"olleh" /** * @param {string} s * ...