vue强制刷新组件

迷南。 2021-09-16 07:40 580阅读 0赞

前言：

在开发过程中，有时候会遇到这么一种情况，通过动态的赋值，但是dom没有及时更新，能够获取到动态赋的值，但是无法获取到双向绑定的dom节点，这就需要我们手动进行强制刷新组件。

官网是这样说的：

70

可能你还不大理解，请继续往下看，下面是我的一个例子，来详细解说了这个方法的使用，

70 1

第一个打印结果

70 2

第二个打印结果

  1.      ![70 3][]

/************************************************************************************************************************************/

一、问题描述：父组件通过v-for渲染子组件，删除子组件数据出现异常。




二、问题原因：出现异常的数据不是响应式依赖，是从vuex读取的。通过测试发现，父组件删除数据，没有重新创建子组件，怀疑是子组件异常的数据是读取的缓存副本。

三、问题解决：根据v-if改变dom结构的特性，手动使子组件重新创建。

1.设置一个数据变量isrefresh=true

20181116113959873.png

2.初始v-if=isrefresh

20181116114016834.png

3.删除时,配合$nextTick()DOM渲染回调函数，使子组件重新创建

20181116114106997.png
/************************************************************************************************************************************/

以上是我对这个Vue.$nextTick的简单了解，大家如果有疑问，大家可以留言交流，自由转载，请注明出处！！！

发表评论

表情：
评论列表 （有 0 条评论，580人围观）

还没有评论，来说两句吧...

相关阅读

    相关 强制 Vue 重新渲染组件

    有时候，依赖 vue 响应方式来更新数据是不够的，相反，我们需要手动重新渲染组件来更新数据。或者，我们可能只想抛开当前的DOM，重新开始。那么，如何让vue以正确的方式重新呈现

    迈不过友情╰迈不过友情╰/ 0 赞/ 334 阅读

    相关 vue强制刷新组件

    前言：        在开发过程中，有时候会遇到这么一种情况，通过动态的赋值，但是dom没有及时更新，能够获取到动态赋的值，但是无法获取到双向绑定的dom节点，这就需要我

    迷南。迷南。/ 0 赞/ 581 阅读