vue transition-group的patch修改意义
~~~javascriptbeforeUpdate: function beforeUpdate () {
// force removing pass
this.__patch__(
this._vnode,
this.kept,
false, // hydrating
true // removeOnly (!important, avoids unnecessary moves)
);
this._vnode = this.kept;
},
~~~
vue的transition-group再beforeupdate的时候做了一个__patch__
其主要意义是在第一次path的时候删除掉无用元素，同时触发移除效果
vue的patch函数是不稳定的
也就是说如果在一次排序的过程中同时进行删除和添加元素
会由于添加的元素而导致删除元素的相对位置发生改变
从而导致删除元素的效果异常
所以分为两步
第一步先删除元素并触发效果
第二步进行添加元素
然后触发updated钩子函数
计算现有元素的相对位置，触发渲染重新绘制动画效果
如果进行一次patch
比如AAAAA切换成BBBBB
这时候变成了BBBBBAAAAA
A的相对位置发生了改变，产生了极大的位移
而如果两次patch
第一次AAAAA删除，原位置
第二次切换BBBBB
则没有错误的位置偏移
页:
[1]