只是一个简单的问题。

你能强迫Vue.js重新加载/重新计算所有内容吗?如果有,怎么做?


当前回答

这对我来说很有效。

created() {
    EventBus.$on('refresh-stores-list', () => {
        this.$forceUpdate();
    });
},

另一个组件触发refresh-stores-list事件将导致当前组件重新呈现

其他回答

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

确定. .可以简单地使用key属性在任何时候强制重新呈现(重新创建)。

<mycomponent :key="somevalueunderyourcontrol"></mycomponent>

有关示例,请参见https://jsfiddle.net/mgoetzke/epqy1xgf/

这里也有讨论:https://github.com/vuejs/Discussion/issues/356#issuecomment-336060875

如果你的URL在加载组件时也发生了变化,你可以在:key属性中使用它。如果你直接在router-view标签上使用它,效果会特别好。这与添加的键的benedit是一个实际绑定到页面内容的值,而不仅仅是一些随机数。

<router-view :key="this.$route.path"></router-view>
<router-view :key="$route.params.slug" />

只需使用你的任何参数的关键,它的自动重载子..

这似乎是matthiasg关于这个问题的一个非常干净的解决方案:

你也可以使用:key=" somvariableunderyourcontrol ",当你想要完全重建组件时改变键

对于我的用例,我将Vuex getter作为道具提供给组件。Vuex会以某种方式获取数据,但反应性不会可靠地重新呈现组件。在我的例子中,将组件键设置为道具上的某个属性可以保证在getter(和属性)最终解析时进行刷新。