为什么aframe动画完成事件多次触发

Question

你好，我是 aframe 的新手，我正在创建一个组件，当我点击一个平面时，会出现一些动画并且平面颜色会发生变化。这是一个非常简单的学习应用程序，但我看到 animation__complete 被多次触发，第一次，第二次，第二次，等等。我不明白我做错了什么我在这里附上了文件的日志link 项目是 https://glitch.com/~amethyst-lamprey-mltmsu585o 这也是我第一次在堆栈溢出上发布问题

控制台日志输出：

about to emit fadein

(index):43 fadeincompleted

(index):35 about to emit fadein

2(index):43 fadeincompleted

(index):35 about to emit fadein

3(index):43 fadeincompleted

(index):35 about to emit fadein

4(index):43 fadeincompleted

(index):35 about to emit fadein

5(index):43 fadeincompleted

(index):35 about to emit fadein

6(index):43 fadeincompleted

控制台日志图像：

Answer 1

这是一个 jQuery 使用问题。每次用户单击时，您的代码都会添加新的事件侦听器，从而导致多次触发动画。将下面的代码移到 click 处理程序之外，以便每个 animationcomplete__fadein 事件只运行一次。

$(loading_sky).on("animationcomplete__fadein",()=>{
   console.log("fadeincompleted");
   el.setAttribute("color","#"+(Math.floor(100000 + Math. random() * 900000) ).toString());
   $.each(scene,(i,e)=>{ e.emit("fadein"); });
   setTimeout(()=>{loading_sky.emit("loadfadeout")},1100)});
 });

Corrected glitch

为什么aframe动画完成事件多次触发

Why is aframe animation complete event firing multiple times

virtual-reality

webvr

aframe