如何重新加载 vue 组件? [英] How can I reload a vue component?

问题描述

我知道解决方案是像这样更新道具数据:

I know the solution is update the prop data like this :

this.selectedContinent = ""

但我想使用另一种解决方案

But I want to use another solution

在我阅读了一些参考资料后，解决方案是:

After I read some reference, the solution is :

this.$forceUpdate()

我试过了，不行

演示和完整代码如下:

https://jsfiddle.net/Lgxrcc5p/13/

你可以点击按钮测试试试

You can click button test to try it

我需要一个解决方案而不是更新属性数据

I need a solution other than update the property data

推荐答案

您必须为组件分配一个键.当你想重新渲染一个组件时，你只需更新密钥.更多信息这里.

You have to assign a key to your component. When you want to re-render a component, you just update the key. More info here.

<template>
    <component-to-re-render :key="componentKey" />
</template>

export default {
  data() {
    return {
      componentKey: 0
    }
  },
  methods: {
    forceRerender() {
      this.componentKey += 1
    }
  }
}

这篇关于如何重新加载 vue 组件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！