当我使用 setAttribute 更改属性时，为什么我的自定义组件没有更新？

Question

我想我不太明白组件和实体是如何工作的。我正在使用出现在 a-frame 帮助 (https://aframe.io/docs/1.3.0/introduction/writing-a-component.html#example-box-component) 中的框组件，我想修改一个属性。这样做时，我认为更新会被激活，但它什么也没做。事实上 oldData 总是空的并且永远不会进入更新选项（除了第一次）：

<script>
  AFRAME.registerComponent("box", {
     ...
  }
</script>

<a-scene> </a-scene>

<script>
  const gScene = document.querySelector("a-scene");

  var camara = document.querySelector("[camera]");
  camara.setAttribute("position", { x: 0, y: 0, z: 10 });

  var p00 = document.createElement("a-entity");
  p00.setAttribute("box", { width: 1, height: 1, depth: 1, color: "#f00" });
  gScene.appendChild(p00);

  p00.setAttribute("height", 3);
  p00.setAttribute("color", "#00f");
</script>

代码的第一部分绘制了一个尺寸为 1x1x1 的红色框。但是当我改变高度或颜色属性时，不要做任何事情。我需要做什么才能触发更新？

提前致谢

Answer 1

您需要更新 box 属性 - setAttribute("height", XXX) 将触发 height 组件中的更新。

如果 color 在 box 架构中，则：

 // this updates the color property of the box attribute,
 // triggering "update" in the "box" component
 p00.setAttribute("box", "color", "red")
 
 // this update the height attribute,
 // triggering "update" in the "height" component
 p00.setAttribute("height", "10");

当我使用 setAttribute 更改属性时，为什么我的自定义组件没有更新？

Why doesn't my custom component update when I change properties with setAttribute?

aframe