my current scenario is that the product search page / search?a=b&c=d and the product details page / item/123 are both in the same router-view ;

I want the effect is that the list page jumps to the details page, then jumps back, and the list page does not refresh

two pages are routed as follows

children: [
    {
        path: "search",
        name: "search",
        meta: {
            title: "",
            keepAlive: true
        },
        component: _import("xx")
    },
    {
        path: "item/:skuid",
        name: "detail",
        meta: {
            title: "",
            keepAlive: false
        },
        component: _import("xxx")
    }
]

search page listens to $route (the following code), and loads the product list as soon as there are changes.

watch: {
    "$route": {
         handler: "getProduct",
         immediate: true
     }
}

search for keep-alive combined with mate.keepAlive is mentioned on the Internet, but I don"t understand the principle, and the following writing method can"t achieve the desired effect

<keep-alive>
    <router-view></router-view>
</keep-alive>

when I use the front-end framework for the first time, I don"t quite understand many concepts. I"m a little confused when I read the document

is my thinking wrong, or my writing is wrong? I hope to get some advice. Please