0

我如何将一个组件的位置传递a-box给另一个组件，a-sphere从而触发a-sphere动画更新到当前a-box位置。是否有从标记中执行此操作的声明性方法？

现场代码：

- var gridSystem = [-5,-4,-3,-2,-1, 0, 1, 2, 3, 4, 5];
    a-scene
      each x in gridSystem
        each y in gridSystem
          a-box(color='#cccccc'
                width='2'
                height='2'
                depth='2'
                position='#{(x + x) - 2} #{(y + y) - 2} -11'
                rotation='0 0 0'
          )
            a-event(name='mouseenter'
                    color='#FF0000'
                    // Here I would like to pass the current a-box position to a-sphere's a-animation thereby updating the position of 'a-sphere' to the last selected 'a-box's position.
            )

            a-event(name='mouseleave'
                    color='#cccccc'
            )

      a-sphere(position = "-12 8 -11" radius="1.25" color="#EF2D5E")
        a-animation(attribute="position"
                    begin="click" // Replace click with a custom event that is listening for a mouseover event from a new 'a-box'.
                    dur="10000"
                    fill="forwards"
                    to="-10 8 -11" // Update this 'to' value to the last mouseover'ed 'a-box'
        )
      a-light(type='point'
              color='#AAA'
              position='0 5 0'
      )

      a-sky(color='#73F7DD')

      a-camera(position='0 1.8 0')
        a-cursor(color='#2E3A87')
4

1 回答 1

0

您可以编写自定义组件来执行此逻辑。例如，您可以使用事件或通过组件传递选择器。编写组件后，这可能是一个示例 API：

<a-sphere update-position="entity: #box; on: my-event">

https://aframe.io/docs/core/component.html

于 2016-05-23T06:30:25.733 回答