vue.js 쿼리 위치 변경 탐색복제

vue.js 쿼리 위치 변경 탐색복제

현재 쿼리 매개 변수 id=2&p=3이(가) vue-pu-try 시도 시 변경하기를 원함:

this.$router.push({query:{id:'2',p:'4'}});

하지만 NavigationDuplicated는

이상한..

쿼리를 변경하고 시계를 트리거하는 방법

에러는 파람이 같은 경우에만 던지므로, 먼저 파람을 확인하면 된다.push또는replace. 또한 비동기/와이트 또는/캐치(catch)를 사용할 수 있으며, 다음 예제를 참조하십시오.

try {
  if (/* id or p have been changed in this.$route.query */) {
    await this.$router.push({query:{id:'2',p:'4'}});
  }

} catch (err) {
...
}

나는 내 쿼리를 조정할 때 "NavigationDuplicated" 오류를 얻는 것과 같은 문제가 있었다.나의 경우 문제는 페이지 로드에서 라우터로부터 직접 쿼리 객체를 순진하게 얻고 있었기 때문이다.나는 그것을 다음과 같이 실었다.

beforeRouteEnter (to, from, next) {
  store.dispatch('setQuery', to.query);
  next();
}

어디에setQueryvuex 저장소 변수를 설정할 수 있음query문제는 이 객체가 경로 객체 내부의 쿼리를 가리키고, 이를 변경하여 직접 경로를 변경한다는 것이다.쿼리하지만 URL이 이 변경에 반응하지 않음.그런 다음 다음과 같은 작업을 수행하십시오.

watch: {
  query (query) {
    this.$router.push({query: query})
  }
}

새 "쿼리"가 기존 "쿼리"와 동일하므로 원래 객체에 포인터를 전달하기 때문에 "NavigationDuplicated" 오류가 발생할 것이다.

이 문제를 피하기 위해 당신은 어떤 종류의 상세 카피를 할 수 있다(예:JSON.parse(JSON.stringify(to.query))을(를) 직접 수정하지 않도록 하기 위해route.query조회를 조정할 때.

버튼을 만들고 라우터 푸시를 하려면 버튼을 로 변환하십시오.<router-link :to="routeObject" />. 대상 경로가 현재 경로인 경우 라우터 링크가 응답하지 않으므로 오류 탐색Duplicate

참고:

routeObject : {
  path : '/search',
  query : {}
}

참조URL: https://stackoverflow.com/questions/58103667/vue-js-change-query-location-navigationduplicated