在使用$router.push()时，如何在参数中传递对象？
在使用$router.push()时，可以通过在参数中传递对象的方式来传递数据。具体的步骤如下：
- 首先，需要将要传递的对象转换为字符串。可以使用JSON.stringify()方法将对象转换为字符串形式。
- 在$router.push()方法中，可以通过query参数来传递数据。将转换后的字符串作为query参数的值传递。
下面是一个示例代码：
// 假设要传递的对象为obj
let obj = { name: 'John', age: 25 };
// 将对象转换为字符串
let objStr = JSON.stringify(obj);
// 在$router.push()方法中传递参数
this.$router.push({ path: '/example', query: { data: objStr } });在接收参数的组件中，可以通过$route.query来获取传递的参数。然后再将字符串转换为对象。
// 在接收参数的组件中
let objStr = this.$route.query.data;
let obj = JSON.parse(objStr);
console.log(obj); // 输出 { name: 'John', age: 25 }这样就可以在使用$router.push()时，通过参数传递对象了。
关于腾讯云相关产品和产品介绍链接地址，可以参考腾讯云官方文档或者腾讯云官网的相关页面。
相关·内容
我想循环遍历一个对象数组，当我单击一个项目时，我想要显示一个填充了来自另一个组件的数据的页面。$router.push(`/artists/${artist.route}`); }</script> 我没有使用<router-link>，因为我不想通过URL传递文本和其他数据 Artist.vue <template> <div&
浏览 231提问于2020-01-06得票数 0
回答已采纳
2回答
$router.push({name: 'list'}); // ok result: Listing
self.$router.push({name: 'list'}); // ok result: Listing
self."username" }; other prop:});
正如您首先看到的，我<
浏览 6提问于2018-05-24得票数 32
回答已采纳
我尝试在重定向中将参数从一个组件传递到另一个组件，如下所示： this.“对象”术语只是实际对象的编码，而$route.query在第一次加载时就可以使用这些编码。有没有其他方法可以使用$router.push()将参数传递给组件，使参数即使在刷新后仍然保留在页面上？ 我可以试一下： this.$router.push</em
浏览 18提问于2020-07-10得票数 1
Router.push({pathname: '/card', query:{data: ObjectData}}) 我获取查询，因为空值无法将对象传递给它
浏览 49提问于2020-07-20得票数 9
我正在开发一个使用NEXT.JS和Redux的电子商务商店。因此，在产品列表页面中，我使用Price Low to High、Price High to Low和New Arrivals进行排序选择下拉列表。选择此选项后，我希望在不刷新页面和API调用的情况下更改URL。我已经尝试使用下面的代码，但它不工作，页面正在重新加载。query: { sort: value }}
上面的代码只是刷新当前页面，并将s
浏览 2提问于2020-07-11得票数 12
回答已采纳
1回答
对于博客，我们可以使用us/blog，也可以只使用uk语言环境的/blog。当我像这样切换到us时：(locale = "us") const handleRoute = (locale) => router.push(`${locale}${router.asPath}`)当我使用handleRoute (locale= "")切换回uk时，它停留在us上，尽管router.asPath等于/blog 完整组件
浏览 34提问于2021-01-22得票数 1
回答已采纳
params: {reportId: 21, tableData: 'data'}}" target="_blank">{{ report.reportId }}</router-link>
但是道具不会传递给子组件如果在不使用target="_blank"的情况下使用路由器链接，则一切正常。也许还有另一种方法可以在新标签页中打开链接并将道具传给它？
浏览 40提问于2018-06-05得票数 0
1回答
在Next.js应用程序中，我使用多语言的next-i18next模块，运行良好。有两种语言，一种是英语，另一种是阿拉伯语。默认为英语。 为了切换，我在NavBar中使用了以下代码。onChangeLanguage = (lang) => (e)=> { if(lang === 'ar') {
浏览 53提问于2021-10-30得票数 1
回答已采纳
我正在通过查询参数将一些数据从一个页面传递到另一个页面，但是我希望将查询隐藏在URL中。 router.pushphone_number: res.data.phone_number} //I want hide this query part from the url
浏览 39提问于2021-12-26得票数 7
回答已采纳
在我的部分，我有： <TouchableRipple onPress={() => router.push(`/conversations/${props.item.id
浏览 4提问于2020-05-09得票数 0
回答已采纳
4回答
当尝试使用Next.js中的动态路由进行浅路由时，页面将被刷新并忽略。似乎很多人都对此感到困惑。假设我们从下一页开始 '/post/[...slug]', { shallow: true }router.push(
'/post/[
浏览 64提问于2020-05-22得票数 24
回答已采纳
4回答
将数据从一个页面传递到另一个页面的简单任务让Vue.js新手非常头疼。这是我的路由器
我正在"/“页面上呈现一个表单，该表单发出一个API请求，
我只想用另一个组件将数据传递到另一个路由页面
在Vue做这件事有那么难吗？今天真的让我很头疼。
浏览 3提问于2017-08-03得票数 9
回答已采纳
我正在尝试动态创建按钮，其名称从对象的键中获取。我需要将相应的值传递给方法，以完成我的代码工作。你是如何完成这两项任务的？$router.push(); }</script>
浏览 6提问于2020-03-04得票数 0
回答已采纳
我需要的是将一个类似“类别”的值传递给动态页面[id].js，这样我就可以在那里做一些更多的逻辑了。category }) { e.preventDefault();
router.push
浏览 3提问于2021-12-28得票数 0
回答已采纳
当我使用axios从我的服务器得到一个错误时，我想把带有vue路由器的错误消息作为道具传递到我的错误页面，我已经将这个页面设置为nuxt details 。router.push({ path: '/error', name: 'error&#
浏览 6提问于2021-11-01得票数 1
4回答
我正在将一个VueJS项目转换为Nuxt.js，我在理解nuxt如何处理路由时遇到了问题。它的文档中没有提到任何关于推进路线的信息。 }这里的目标是当用户按下搜索栏中的enter<
浏览 0提问于2018-05-16得票数 19
回答已采纳
我显示了一个区域设置列表，当用户单击其中的任何一个时，我使用useRouter将用户重定向到当前页面，但在所选的区域设置中：<Link pathname: '/conference/[id
浏览 4提问于2021-11-20得票数 1
回答已采纳
问题情况 props: route => { },这导致在Order.vue中没有定义道具。props
浏览 5提问于2021-03-30得票数 3
回答已采纳
在我的axios.config.js文件中，我有这段代码： axios.interceptors.response.use( error === "login") { name: "errorPage",
query: { template: "error.response && error.response.sta
浏览 30提问于2019-06-10得票数 1
我设法把一个物体传递到对角线上。但是，如何掩蔽上述url中的信息？
这是我添加参数时的路径。
浏览 6提问于2022-10-02得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
