**已关闭。**此问题需要debugging details。它目前不接受回答。
编辑问题以包括desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem。这将有助于其他人回答这个问题。
22天前关闭
这篇文章是编辑并提交审查21天前.
Improve this question的
我正在使用Ember JS的应用程序,我想在更新我的DOM之前显示完整的加载器,例如,
table.hbs
<div id="full-loader"></div>
{{#each data as |val|}}
<p>val</p>
{{/each}}
<button {action 'updateData'}>Add More</button>
字符串
table.js
addValues(){
for(var i=0;i<100;i++){
data.pushObject(i)
}
@action
updateData(){
Ember.$("#full-loader").css("display","block");
addValues();
}
didRender(){
Ember.$("#full-loader").css("display","none");
}
型
完全加载程序从未显示,但当我在调用addValues()
时使用setTimeOut()
时,现在完全加载程序显示了!!!.这是什么原因造成的?
2条答案
按热度按时间blpfk2vs1#
someFuncToUpdateDOM();
正在阻塞。它只是在主事件循环中执行操作。当阻塞代码运行时,浏览器不执行DOM的重绘(这是一个效率特性;这意味着您可以对DOM进行100次更改,然后进行一次重绘,而不是100组更改和100次关联的重绘)。
添加
setTimeout
意味着子序列阻塞代码不会立即运行。当它等待超时过期并被放入任务队列时,浏览器会继续做其他事情(包括重新绘制)。tjvv9vkg2#
可以尝试requestAnimationFrame()而不是setTimeout()
字符串