欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Vue—强制刷新子组件

程序员文章站 2022-06-28 18:50:50
【前言】当一个页面(父组件)包含多个子组件并刷新当前页面的时候,子组件在父组件页面不显示的问题,可以采用强制刷新子组件方法。【内容】采用v-if会销毁组件并且重绘,这样就会重载组件。// 1、父组件中的子组件// 2、在父组件内的增删改查方法中操作this.DestroyIncomeStatistics = false;// 3、然后你的方法成功后,Vue 实现响应式并不是数据发生变化之后 D...

【前言】

当一个页面(父组件)包含多个子组件并刷新当前页面的时候,子组件在父组件页面不显示的问题,可以采用强制刷新子组件方法。

【内容】

采用v-if会销毁组件并且重绘,这样就会重载组件。

// 1、父组件中的子组件
<child v-if="DestoryChild == true" />

// 2、在父组件内的增删改查方法中操作
this.DestroyIncomeStatistics = false;

// 3、然后你的方法成功后,Vue 实现响应式并不是数据发生变化之后 DOM 立即变化,而是按一定的策略进行 DOM 的更新。

// 4、$nextTick 是在下次 DOM 更新循环结束之后执行延迟回调,在修改数据之后使用 $nextTick,则可以在回调中获取更新后的 DOM
   this.$nextTick(() => {
          this.DestoryChild = true;
        });

// 完成强制刷新

本文地址:https://blog.csdn.net/frj0260/article/details/109560248

相关标签: 技术成长轨迹