对于那些还在四处寻找的人来说，现在有一个包。

https://github.com/gabrielmbmb/vuex-multi-tab-state

我所要做的就是安装它，并将它添加到我的插件中。ts(就像它在那个页面上显示的那样)，它确实做了我想要的。

添加以下代码:

this.$forceUpdate()

我找到了一个办法。这有点俗气，但很管用。

vm.$set("x",0);
vm.$delete("x");

其中vm是视图模型对象，x是一个不存在的变量。

Vue.js会在控制台日志中抱怨这个问题，但它确实会触发所有数据的刷新。使用版本1.0.26进行测试。

2021年12月更新:

你可以通过添加:key="$route.fullPath"强制重载组件。

对于子组件:

<Child :key="$route.fullPath" />

对于router-view标签:

<router-view :key="$route.fullPath" />

然而,:关键= " $路线。fullPath只能强制重载不同路由的组件，不能强制重载同一路由的组件。为了能够强制重载同一路由的组件，我们需要在:key="$route "中添加一个数组"value"。fullPath，并修改value。所以它变成:key="[$route。"fullPath, value]，我们需要改变value。

*我们可以将Array赋值给:key=。

<template>
  <Child 
    :key="[$route.fullPath, value]" // Can assign "Array" to ":key="
    @childReload="reload" // Call @click="$emit('childReload')" in   
  />                      // Child Component to increment the value.
</template> 

    OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR

<template>
  <router-view 
    :key="[$route.fullPath, value]" // Can assign "Array" to ":key="
    @routerViewReload="reload" // Call @click="$emit('routerViewReload')"
  />                           // in Child Component to increment the value.
</template>
    
<script>
export default {
  name: "Parent", components: { Child, },
  data() {
    return {
      value: 0,
    };
  },
  methods: {
    reload() {
      this.value++;
    }
  }
}
</script>

但是，要继续使用“$route. conf”fullPath"和"value"有时会导致一些错误，所以只有当一些事件如Click发生时，我们才使用"$route "。fullPath和value。除非发生一些像Click这样的事件，我们总是只需要使用"$route.fullPath"。

这是最终的代码:

<template>
  <Child 
    :key="state ? $route.fullPath : [$route.fullPath, value]"
    @childReload="reload" // Call @click="$emit('childReload')" in
  />                      // Child Component to increment the value.
</template>
    
    OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR OR
    
<template>
  <router-view 
    :key="state ? $route.fullPath : [$route.fullPath, value]"
    @routerViewReload="reload" // Call @click="$emit('routerViewReload')" in
  />                           // Child Component to increment the value.
</template>
        
<script>
export default {
  name: "Parent", components: { Child, },
  data() {
    return {
      state: true,
      value: 0,
    };
  },
  methods: {
    reload() {
      this.state = false;
      this.value++;
      this.$nextTick(() => this.state = true);
    }
  }
}
</script>

不幸的是，在Vue中没有正确强制重新加载组件的简单方法。这就是Vue目前的问题所在。

为了重新加载/重新渲染/刷新组件，停止长编码。Vue.JS可以做到这一点。

只需使用:key属性。

例如:

<my-component :key="unique" />

我正在使用BS Vue表槽。我要为这个组件做一些事情，让它是唯一的。

尝试使用这个。$router.go(0);手动重新加载当前页面。