vue-router query 传对象需要JSON.stringify()转化
1
2
3
|
this .$router.push({path: '/wx/detail' , query: {res: data}}) // data中的数据结构如下一个对象里边有数组有对象等等。。。 {title: |
1
2
3
4
5
6
7
8
|
// 列表页点击跳转 let data = JSON.stringify(result) // result传递的query参数。我们转为string this .$router.push({path: '/wx/detail' , query: {res: data}}) // 详情页获取 let data = JSON.parse( this .$route.query.res) this .result = Object.assign({}, data) |
1
|
'xxx' , imgList: [ '1' , '2' ] } |
首先第一点击跳转详情页显示正常。如下
那么接下来我们刷新下页面。你会发现你得对象完全变了。成了一个"[object Object]"这是怎么回事呐?怎么解决呐?
不知道为什么vue-router会这样做?接下来会去研究下源码,或者浏览器的处理机制。先说下解决方案吧。
vue-router query 传对象需要JSON.stringify()转化的更多相关文章
- vue router & query params
vue router & query params vue router get params from url https://zzk.cnblogs.com/my/s/blogpost-p ...
- vue $router.push 传参的问题
$router 和 $route的区别 $route为当前router跳转对象里面可以获取name.path.query.params等 $router为VueRouter实例,想要导航到不同URL, ...
- js对象序列化JSON.stringify()与反序列化JSON.parse()
草稿: parse用于从一个字符串中解析出json对象,如 var str = '{"name":"huangxiaojian","age" ...
- js 对象与json的转化
1.将对象转换为JSON格式字符串 JSON.stringify(object) 2.将JSON字符串转换为对象 JSON.parse(jsonString);
- JSON.stringify转化报错
两种方式会导致该错误:1.json格式数据存在循环调用. 举个例子: var obj = { title: '标题'}obj.content = obj;JSON.stringify(obj); ...
- Python之dict(或对象)与json之间转化
在Python语言中,json数据与dict字典以及对象之间的转化,是必不可少的操作. 在Python中自带json库.通过import json导入. 在json模块有2个方法, loads():将 ...
- Vue路由query传参
1.不要进行过深的嵌套 let id = 'uyu' this.$router.push({ path: '/mrp_detail', query: { re_order_id: id, option ...
- Jackson学习二之集合类对象与JSON互相转化--转载
原文地址:http://lijingshou.iteye.com/blog/2003059 本篇主要演示如何使用Jackson对List, Map和数组与JSON互相转换. package com.j ...
- vue router使用query和params传参的使用
传参是前端经常需要用的一个操作,很多场景都会需要用到上个页面的参数,本文将会详细介绍vue router 是如何进行传参的,以及一些小细节问题.有需要的朋友可以做一下参考,希望可以帮到大家. Vue ...
随机推荐
- asp.net core系列 36 WebAPI 搭建详细示例
一.概述 HTTP不仅仅用于提供网页.HTTP也是构建公开服务和数据的API强大平台.HTTP简单灵活且无处不在.几乎任何你能想到的平台都有一个HTTP库,因此HTTP服务可以覆盖广泛的客户端,包括浏 ...
- asp.net core系列 31 EF管理数据库架构--必备知识 反向工程
一. 反向工程 反向工程是基于数据库架构,生成的实体类和DbContext类代码的过程,对于Visual Studio开发,建议使用PMC.对于其他开发环境,请选择.NET Core CLI工具( ...
- redis 系列15 数据对象的(类型检查,内存回收,对象共享)和数据库切换
一. 概述 对于前面的五章中,已清楚了数据对象的类型以及命令实现,其实还有一种数据对象为HyperLogLog,以后需要用到再了解.下面再了解类型检查,内存回收,对象共享,对象的空转时长. 1.1 ...
- Javascript 链式操作以及流程控制
春节过后,感觉过年吃的油腻的食品转化的脂肪都长到 脑子去了. 根本转不动啊 上班第一天 实在是写不动代码了, 顺手打开多天为看的 收件箱,查看查看邮件,看看春节期间 风云变幻的前端圈又有哪些大事发生. ...
- Spring Cloud中服务的发现与消费
之前没注意,微信公众号的图片不能引用到其他地方,本文图片显示不正常,原图在写完博客后已经删了,,,,,,所以本文小伙伴可以移步这里https://mp.weixin.qq.com/s/GoIZdwt5 ...
- selenium和webdriver区别
接触selenium大概半年时间了.从开始的预研,简单的写个流程到后期的自动化框架的开发,因为本人不属于代码方面的大牛,一直的边研究边做.逐步深入学习.近期发现自己对本身selenium的发展还存在困 ...
- CentOS6.5下DNS服务器搭建与配置
一.安装机器情况 192.168.1.70(dns 主节点) 192.168.1.71(dns 从节点) 二.主节点DNS的安装及配置 1. DNS服务器所需的软件包安装 yum -y install ...
- 痞子衡嵌入式:ARM Cortex-M文件那些事(5)- 映射文件(.map)
大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家讲的是嵌入式开发里的map文件. 第四节课里,痞子衡给大家介绍了第一种output文件-relocatable文件,本文继续给大家讲projec ...
- [UOJ310] 黎明前的巧克力
Sol 某比赛搬了这题. 首先选择两个不交非空子集且异或和为0的方案数,等价于选择一个异或和为0的集合,并把它分成两部分的方案数. 这显然可以DP来算,设 \(f[i][j]\) 表示前\(i\)个数 ...
- year 和 weak year 的区别
java 中使用 SimpleDateFormat 时,会遇到 year 和 week year 这两个概念,特此记录. google 答案: A week year is in sync with ...