A-Frame - 使用自定义（'a-sound'）源播放/暂停声音

Question

编辑 2：这是工作代码。非常感谢 Piotr 的帮助，如果没有你们，我不可能如此轻松地做到这一点。

sceneEl.querySelector('a-sound').setAttribute('sound', {src:url3}); 
      let playing = false;
      var el = document.querySelector('a-box');
      let audioEl = document.querySelector("a-sound");
      var audio = audioEl.components.sound;
      el.addEventListener('click', () => {
      if (!playing) {
      audio.playSound();
      } else {
      audio.stopSound();
      }
      playing = !playing;
      })


      } );
      request.send( null );
      }
      });

编辑：我已经从动态 URL（在我的 JSON 文件中）播放声音，但我似乎无法正确获取事件侦听器功能（用于播放/点击暂停）。

sceneEl.querySelector('a-sound').setAttribute('sound', {src:url3}); 
      let audioEl = document.querySelector("a-sound");
      let audio = audioEl.components.sound;
      sceneEl.querySelector('a-box').addEventListener('click', function () {
      if(!playing) {
          audio.play();
       } else {
          audio.pause();
          audio.currentTime = 0;
       }
       playing = !playing;
       });   
    } );
      request.send( null );
      }
      });

原文：我在 A-Frame 中使用 this 组件，但我希望从 ('a-sound') 实体中的 src 播放声音，而不是从资产链接播放声音。原因是我从 JSON 数组动态加载声音文件，因此它们不存在于任何资产列表中。我已经加载了所有文件，但是无法将此组件挂接到我加载的sceneEl.querySelector('a-sound').setAttribute('sound', {src:url3}); 代码中。我认为这只是一个小语法问题，但我不是 100% 确定。有人可以看一下这个并告诉我它是否可行吗？这是代码（除了 querySelector 中的 (a-sound) 之外，与链接相同。

       AFRAME.registerComponent('audiohandler', {
       init:function() {
       let playing = false;
       let audio = document.querySelector('a-sound');
       this.el.addEventListener('click', () => {
       if(!playing) {
          audio.play();
       } else {
          audio.pause();
          audio.currentTime = 0;
       }
       playing = !playing;
       });
       }
       })
    </script> 

Answer 1

使用<a-sound> 你必须以不同的方式处理事情。

播放/停止声音应在sound component 内完成。您需要通过yourEntityName.components.sound 访问它并使用playSound() 和stopSound() 方法。

在我的glitch 上查看。我通过setAttribute() 设置源，并制作播放/停止按钮。

---

我的<a-sound> 有一个几何形状作为按钮，但是您可以创建一个<a-sound> 实体，并像这样使用它：

let audioEl = document.querySelector("a-sound");
audioEl.setAttribute("src", "sourceURL");

let audio = audioEl.components.sound;
// play = audio.playSound();
// stop = audio.stopSound():

---

此外，节点未完全加载存在许多问题。看看这个例子：

<a-entity component></a-entity>
<a-sound></a-sound>

如果组件试图获取对document.querySelector("a-sound").components.sound 的引用，它可能是未定义的。如果是这样，您应该尝试等到它发出loaded 信号。