为什么我必须等到在body.js中添加主体并对它施加力之前？

问题描述

我使用something.js做了非常简单的事情。页面末尾有一个脚本，用于创建Engine，Render和World。然后我加一个球并施加力。问题是几乎每次我重新加载页面时，球都会落在不同的位置。这一切都取决于在创建和运行引擎以及将实体添加到世界并对其施加力量之间需要花费多少时间。 如果我立即这样做，身体受到的力应该是它的两倍。但是如果我由于设置DOMContentLoaded而等待一秒钟，则window.onload，setTimeout或onClick会获得正常的力量。

一劳永逸地执行，会使身体承受的力量大约是我等待的力量的两倍。

<script>
            let Engine = Matter.Engine,Render = Matter.Render,World = Matter.World,Bodies = Matter.Bodies,Body = Matter.Body;
    
            let engine = Engine.create();
            let render = Render.create({
                element: document.body,engine: engine,options: {
                    width: 1900,height: 900,wireframes: false
                }
            });
    
            Engine.run(engine);
            Render.run(render);
                
            let floor = Bodies.rectangle(950,895,1900,10,{ isstatic: true });
            let ball = Bodies.circle(200,800,20,{ friction: 10,restitution: 0,density: .005,isstatic: false });
            World.add(engine.world,[floor]);
            
            
            World.add(engine.world,[ball]);
            Body.applyForce(ball,ball.position,{x: .2,y: -.2});
            
        </script>

如果我因以下原因而等待

window.onload = (e) =>{
                World.add(engine.world,[ball]);
                Body.applyForce(ball,y: -.2});
};

或

window.setTimeout(() => {
                World.add(engine.world,y: -.2});
},1000);

然后力量是正常的，就像我单击鼠标一样。

document.onclick = (e) => {
                World.add(engine.world,y: -.2});
}

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）