뷰 라우터는, 내 응용 프로그램에서 검색 필드와 데이터 테이블을 만드는 중이라서 경로

Question

를 구성하고 난 다음 동작을 구현하고 싶습니다 :

사용자 유형 연구를 URL이 업데이트됩니다. 사용자가 링크에서 을 클릭하고 탐색기에서 '뒤로'를 누르면 마지막으로 검색으로 돌아옵니다. 당신이 볼 수 있듯이

export default { 
    data() { 
    return { 
     search: '' 
    } 
    }, 
    watch: { 
    search (value) { 
     this.$router.replace('/products?search=' + value) 
    } 
    } 
} 

것은, 내가 라우터의 replace 기능을 사용하고 있습니다 : 순간

, 나는 다음과 같은 일을하고 있어요. 그게 내가 작동하도록 해준다. 그리고 사용자가 검색하는 동안 "뒤로"를 친다면 그는 최후의 연구가 아닌 마지막 페이지로 갈 것이고, 그것은 내가 원하는 것일 것이기 때문에 push 방법보다 낫습니다.

그러나 URL 작성 방법이 마음에 들지 않습니다.

내가 그런 일을 할 싶어요 :

watch: { 
    search (value) { 
    let route = new Route(this.$route) 

    route.query.search = value 

    this.$router.replace(route.getPath()) 
    } 
} 

이 때문에의 사용자가 같은 페이지 매김이나 뭐 같은 다른 매개 변수가 있다고 가정 해 봅시다, 그들은 삭제됩니다. 내 실제 url 걸릴 및 쿼리 문자열 매개 변수를 추가/바꾸기 메서드를 싶습니다.

내가 Vue Router로 얻을 수있는 것이거나 다른 것을해야합니까? 다른 패키지/Vanilla JS?

Answer 1

객체 위치 매개 변수 $router.replace을 사용하지 않는 이유는 무엇입니까? 예 :

watch: { 
    search (value) { 
    this.$router.replace({ path: 'products', query: { search: value }}) 
    } 
}