巴比伦。动画事件未按预期运行

Question

我需要Babylon JS在特定帧触发事件。我正在使用巴比伦。动画事件。但是，当调用操作函数时，其内部变量未正确设置。

在下面的示例中，我创建了一个简单的场景并添加了一个框。该框将沿 x 轴缓慢移动。每 10 帧，我希望调用一个函数并"做某事"。在此示例中，它将显示帧编号。

var createScene = function (( {

// This creates a basic Babylon Scene object (non-mesh)
var scene = new BABYLON.Scene(engine);
var box = BABYLON.MeshBuilder.CreateBox("box", {size:10}, scene);
//setup camera
var camera = new BABYLON.ArcRotateCamera("Camera", BABYLON.Tools.ToRadians(-120), BABYLON.Tools.ToRadians(80), 65, new BABYLON.Vector3(0, -15, 0), scene);    camera.attachControl(canvas, false);
//setup lights
var light1 = new BABYLON.PointLight("light1", new BABYLON.Vector3(-14, 25,25), scene);
light1.intensity = 15;
var animationBox = new BABYLON.Animation("myAnim", "position", 30, BABYLON.Animation.ANIMATIONTYPE_VECTOR3, BABYLON.Animation.ANIMATIONLOOPMODE_CONSTANT);
var keys = [];
for(var i=0; i<100; i++)
{
keys.push({
frame: i,
value: new BABYLON.Vector3(i/10, 0, 0)
});
if(i%10==0)
{
animationBox.addEvent(new BABYLON.AnimationEvent( i, function() { console.log( "Frame: "+i ) }, true ) );
/*
Expected result:
Frame: 0
Frame: 10
Frame: 20
etc.
Actual result:
Frame: 100
Frame: 100
Frame: 100
etc.
*/
}
}
animationBox.setKeys(keys);
box.animations.push(animationBox);
scene.beginAnimation(box, 0, 100, true);
return scene;

};

预期结果：
帧：0 框架： 10 框架： 20 等。

实际结果： 框架： 100 框架： 100 框架： 100 等。

有些东西我没有得到。上面的代码可以在这里运行： https://playground.babylonjs.com/#B3RECS#1

Answer 1

您好，这是因为您正在捕获 i 的最后一个值。 您需要执行闭包以捕获当前值：

https://playground.babylonjs.com/#B3RECS#2

(这是一个一般的JS问题，而不是巴比伦的问题.js(