路由本身有query参数,但是我点击更新了query,也push了,页面url不改变,这个时候其实用到了对象的拷贝,你需要对query对象做拷贝,对象的深拷贝和浅拷贝
let query = this.$router.history.current.query;
let path = this.$router.history.current.path;
//对象的拷贝
let newQuery = JSON.parse(JSON.stringify(query));
newQuery.pid = pid;
this.$router.push({ path, query: newQuery });
以上只是其中一种,至于对象的深拷贝浅拷贝需要自己整理一下
路由本身有query参数,但是我点击更新了query,也push了,页面url不改变,这个时候其实用到了对象的拷贝,你需要对query对象做拷贝,对象的深拷贝和浅拷贝 let query = this.$router.history.current.query; let path = this.$router.history.current.path; //...
最近在写项目,在写项目的过程会总发现这样或者那样的问题,比如说
vue-router
中的
query
如何
传
递动态的
参数
,经过了一些波折才解决了问题,问题描述如下:
希望跳转的时候
url
是这样的:http://localhost:8080/editmovie?id=****
但是呢?上面的只是一个静态的,
url
永远会是:http://localhost:8080/editmovie?id=111
实际上我需要
就可以修改了
但是当已有
query
对象里面修改其中一个值,就会发现虽然this.$route.
query
发生
改变
但是浏览器的
url
上的
参数
并没有发生变化, 尝试将已有的
参数
进行深拷贝突然发现就可以了
let new
Query
= JSON.parse(JSON.stringify(this.$route.
query
));
new
Query
.index = 2;
let new
Query
= this.$route.
query
new
Query
[key] = value
this.$
router
.
push
({
query
: new
Query
})
一般往
url
栏里边添加
参数
,当
参数
为多个时,为了方便,会直接获取到当前
url
栏里边原有的
query
参数
,然后在其中添加新的
参数
即可。
但此时往往
**问题场景:**首页搜索栏输入不同关键字,使用this.$
router
.
push
()不同入参,相同
URL
页面
不刷新
**解决措施:**如下示例,每次检索时调用一次this.reload()即可。
**处理思路:**使用VUE的v-if控制DOM
App.vue
<template>
<!-- VUE 路由 -->
<
router
-view v-if="RouteState"></
router
-view>
</template>
注意:th