Aframe a-sky rotation not updating

Question

I need you help! I have integrated aframe into my Vue js project and I need the rotation data from the a-sky element in this particular situation. As I move the a-sky in the browser, the rotation data does not update, even if I check it in the aframe inspector.

<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>

I have my created() hook set up for listening to changes, but since there is no change, the listener does not fire.

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);
  }
});

},

Any suggestions are appreciated.

Answer 1

您没有移动天空，而是移动了相机。