我写了一个类似Transition的组件用来制作css动画，在修改data后，使用this.$nextTick 以期望能捕获dom结构渲染完成后的回调，可是并不成功，我在nexttick后设置timeout50-100 即可生效。
我知道原生小程序setData后会有回调
请问uniapp中应该如何获得这个时机呢？
Anfo
- 发布：2020-06-02 15:59
- 更新：2022-06-01 17:36
- 阅读：2350
贴一下 你的代码片段吧
-
Anfo (作者)
if(newVisible){
if(this._delayInstance){
clearTimeout(this._delayInstance);
this.leaving = false;
this.leaveActive = false;
}
this.visibleDelay = true;
this.entering = true;
this.$nextTick(()=>{
this.enterActive = true;
this.$nextTick(()=>{
setTimeout(()=>{
this.entering = false
this.$nextTick(()=>{
if(this._enteringInstance){
clearTimeout(this._enteringInstance);
}
this._enteringInstance = setTimeout(()=>{
this.enterActive = false;
// r()
}, this.duration);
});
}, 100)
})
});
}else{
// xxxxx
}
看到settimeout(xxx, 100) 那，就是那儿 如果不设置100 就不行 了 50就偶尔行 偶尔不行。
2020-06-04 10:26
Anfo (作者) - 我是个好人
if(newVisible){
if(this._delayInstance){
clearTimeout(this._delayInstance);
this.leaving = false;
this.leaveActive = false;
}
this.visibleDelay = true;
this.entering = true;
this.$nextTick(()=>{
this.enterActive = true;
this.$nextTick(()=>{
setTimeout(()=>{
this.entering = false
this.$nextTick(()=>{
if(this._enteringInstance){
clearTimeout(this._enteringInstance);
}
this._enteringInstance = setTimeout(()=>{
this.enterActive = false;
// r()
}, this.duration);
});
}, 100)
})
});
}else{
// xxxxx
}看到settimeout(xxx, 100) 那，就是那儿 如果不设置100 就不行 了 50就偶尔行 偶尔不行。
Anfo (作者)
就是模仿Vue的原生Transition，
然后再before-enter的类设置完成并渲染到dom之后 就立即取消来实现一个进场的动画，entering就控制了这个类，然后entering设置true后调用nexttick 再置为false，并没有 触发动画，偶尔可以，偶尔不行。但是加个settimeout100 就一定可以，50也偶尔可以偶尔不行
2020-06-04 11:25
DCloud_UNI_HT
回复 Anfo: 现在只能暂时 加 setTimeout 去延时一下，可能 nextTick 的实现还是有些问题，要优化一下。我先排查一下问题
2020-06-04 14:20
Anfo (作者)
回复 DCloud_UNI_HT: 好的
2020-06-04 14:49