Aframe a-sky 旋转不更新答案

【问题标题】：Aframe a-sky rotation not updatingAframe a-sky 旋转不更新
【发布时间】：2017-07-20 05:40:02
【问题描述】：

我需要你的帮助！我已将 aframe 集成到我的 Vue js 项目中，在这种特殊情况下，我需要来自 a-sky 元素的旋转数据。当我在浏览器中移动天空时，旋转数据不会更新，即使我在 aframe 检查器中检查它也是如此。

<a-scene embedded>
<a-entity camera  look-controls="reverseMouseDrag: true" position="0 1 3" ></a-entity>
<a-text font="roboto" width="30" align="center" color="#ccc" opacity="1" value="North" position="0 -3 -4"></a-text>
<a-text font="roboto" width="30" align="center" color="#ccc" opacity="1" value="South" position="0 -3 10" rotation="0 -180 0"></a-text>
<a-text font="roboto" width="30" align="center" color="#ccc" opacity="1" value="East" position="8 -3 3" rotation="0 -90 0"></a-text>
<a-text font="roboto" width="30" align="center" color="#ccc" opacity="1" value="West" position="-7 -3 3" rotation="0 -270 0"></a-text>
<a-sky id="sky" :src="getPanoImage" rotation="0 -130 0" :phi-start="getPhi"></a-sky>

我设置了 created() 挂钩来监听更改，但由于没有更改，监听器不会触发。

created() {
document.querySelector('#sky').addEventListener('componentchanged', function (evt) {
  if (evt.detail.name === 'rotation') {
    console.log('Camera rotation went from', evt.detail.oldData, 'to', evt.detail.newData);
  }
});

欢迎提出任何建议。

【问题讨论】：

标签： javascript vue.js aframe

【解决方案1】：

你不是在移动天空，你是在移动相机。

【讨论】：

我想我必须为相机实体添加旋转，然后监听该元素的变化。我在检查器中测试了这种方法，旋转数据发生了变化，但不知何故，监听器仍然没有被触发。编辑：对于未来的问题：您必须将侦听器放入 mount() 生命周期挂钩才能正确触发。