只是一个简单的问题。
你能强迫Vue.js重新加载/重新计算所有内容吗?如果有,怎么做?
只是一个简单的问题。
你能强迫Vue.js重新加载/重新计算所有内容吗?如果有,怎么做?
当前回答
请读一读 http://michaelnthiessen.com/force-re-render/
可怕的方式:重新加载整个页面 更好的方法:使用Vue的内置 最好的方法:在你的 组件
<template>
<component-to-re-render :key="componentKey" />
</template>
<script>
export default {
data() {
return {
componentKey: 0,
};
},
methods: {
forceRerender() {
this.componentKey += 1;
}
}
}
</script>
在某些情况下,我也用watch。
其他回答
确定. .可以简单地使用key属性在任何时候强制重新呈现(重新创建)。
<mycomponent :key="somevalueunderyourcontrol"></mycomponent>
有关示例,请参见https://jsfiddle.net/mgoetzke/epqy1xgf/
这里也有讨论:https://github.com/vuejs/Discussion/issues/356#issuecomment-336060875
有两种方法,
你可以在你的方法处理程序中使用$forceUpdate()
<您的组件@click = " reRender ()" > < /组件>
<script>
export default {
methods: {
reRender(){
this.$forceUpdate()
}
}
}
</script>
你可以给你的组件一个:key属性,并在想要渲染时增加
<your-component:key="index" @click="reRender()" > < /组件>
<script>
export default {
data() {
return {
index: 1
}
},
methods: {
reRender(){
this.index++
}
}
}
</script>
如果你的URL在加载组件时也发生了变化,你可以在:key属性中使用它。如果你直接在router-view标签上使用它,效果会特别好。这与添加的键的benedit是一个实际绑定到页面内容的值,而不仅仅是一些随机数。
<router-view :key="this.$route.path"></router-view>
对于那些还在四处寻找的人来说,现在有一个包。
https://github.com/gabrielmbmb/vuex-multi-tab-state
我所要做的就是安装它,并将它添加到我的插件中。ts(就像它在那个页面上显示的那样),它确实做了我想要的。
尝试使用这个。$router.go(0);手动重新加载当前页面。