vue 强制刷新组件

1.在组件中方法使用$forceUpdate方法

import Vue from 'vue'
Vue.forceUpdate() // 启动配置

export default {
  data () {},
  methods: {
    handleRefresh() {
      // 写入方法
      this.$forceUpdate()
    }
  }
}

2.在组件中绑定key值 

<template>
  <div>
    <demo :key="count"></demo> // 绑定key值
    <button @click="handleRefresh">刷新demo组件</button>
  </div>
</template>
<script>
import demo from "./test.vue";
export default {
  name: "refreshDemo",
  data() {
    return {
      count: 0 
    };
  },
  methods: {
    handleRefresh() {
      this.count += 1 // 更改key值,从而达到刷新组件的效果 当key改变时就是释放原始组件,重新加载新的组件
    }
  }
};
</script>

猜你喜欢

转载自www.cnblogs.com/dachengzizi/p/12296292.html