Vue.js VueRouter在导航后使组件保持活动状态

我定义了以下路由器：

const router = new VueRouter({
    routes: [
        {
            path: "/",
            name: "home",
            component: Home
        },
        {
            path: "/hello",
            name: "hello",
            component: Hello
        },
        {
            path: "/foobar/:slug",
            name: "foobar",
            component: require("./views/Foobar.vue").default
        }
    ]
});

这正在工作，所有内容都在

中正确导航

当我导航到“foobar”路由器时；我做了一些启动网络摄像头的东西。 但当我导航到另一条路线时，网络摄像头会保持活动状态

我就是这样导航的：

<router-link replace :to="{ name: 'home' }">home</router-link>

---

我怎样才能强制进行硬导航或类似的操作？我希望销毁以前的组件。

您需要先关闭网络摄像头

可能的解决办法：

---

在使用网络摄像头的Vue路由组件中，创建一个

destroy（）{}

函数，并在那里停止网络摄像头。它将在退出路由之前关闭它。

您需要先关闭网络摄像头

可能的解决办法：

---

在使用网络摄像头的Vue路由组件中，创建一个

destroy（）{}

函数，并在那里停止网络摄像头。它将在退出路线前关闭。

但是，在导航到另一个组件后，如何关闭每个组件？我不需要任何组件在后台保持活动状态。它会自动保持活动状态，网络摄像头不会关闭。这不是真正的问题。我明白你的意思，但那不是我想要的。当我导航到另一个组件时，上一个组件/视图应该会自动清除。现在看起来它仍然处于活动状态，但我想在导航回foobar-route时重新渲染组件。Niek是正确的。Vue路由器总是在您离开时销毁组件，除非使用了

保持活动状态

组件。网络摄像头是浏览器API，它不会因为某些JavaScript（vue）组件被破坏而关闭。您需要在

destroy

hook中自己关闭它……但是在导航到另一个组件之后，我可以做些什么来关闭每个组件？我不需要任何组件在后台保持活动状态。它会自动保持活动状态，网络摄像头不会关闭。这不是真正的问题。我明白你的意思，但那不是我想要的。当我导航到另一个组件时，上一个组件/视图应该会自动清除。现在看起来它仍然处于活动状态，但我想在导航回foobar-route时重新渲染组件。Niek是正确的。Vue路由器总是在您离开时销毁组件，除非使用了

保持活动状态

组件。网络摄像头是浏览器API，它不会因为某些JavaScript（vue）组件被破坏而关闭。你需要在

destroy

hook中自己关闭它。。。

this.$router.replace({name: "workshop"});