vuejs如何重新渲染组件？

Question

各位高手：
我有个特别的需求，
子组件a：
有个展开键，点击后计算一个数组赋值给vuex中的全局变量
有个刷新键，点击后重新计算这个数组再重新赋值
子组件b：
是个循环列表，接受vuex中的全局变量然后渲染。

现在这个展开键使用正常，但刷新键无效。
我觉得是不是应该实现一个刷新后重新加载这个组件的功能？

Answer 1

以下只谈论重新渲染，至于你的刷新键无效，也有可能是那的数据并不是响应式造成的。

1、不妥但简单粗暴的方法：使用 v-if 来生成或摧毁组件（会经历其所有的正常生命周期）

<test v-if="isShow"></test>

this.isShow = false
this.$nextTick(() => {
    this.isShow = true;
});

2、较好的方法：Vue 的 foreUpdate 方法（仅仅是强调渲染，或许不能更新计算属性）

this.$forceUpdate()

3、最好的方法：对元素/组件上的 key 属性进行更改以重新渲染以更新状态。

<test :key="index"></test>

this.index += 1

Answer 2

常用的方式
1: 在组件内watch一个vuex里面的变量, 刷新当前页数据(不推荐)
2: 给组件v-if 推荐
3: 给router地址一个时间戳 不推荐