Aframe-拖动的事件

Question

我正在使用aframe-react和aframe单击拖动组件。

这运行良好，我现在正在尝试弄清楚如何向实体添加事件，以便在拖动一个实体时可以更新这些计算(这些实体是它们之间的肘部连接 - 我想在拖动项目时更新这些(

稍后给出了实体的单击拖动属性，但是我假设它最好在此处添加侦听器。

库有一个事件的示例

https://github.com/jesstordord/aframe-click-drag-component/blob/master/master/examples/events/index.html

并将事件记录为单位

  event-set__1="_event: dragstart; material.opacity: 0.2" 

但是，我似乎无法弄清楚如何在此类中呼叫该函数，

即。像

event-set __1 =" _ event：dragstart"应调用dragstart((函数。

关于如何执行此操作的线索？

const scalar = 0.2
const offsetX = 4
const offsetY = 4.5
config.scale = {x: scalar, y: scalar, z: scalar}
if (editingHotspot.shape) {
  buttonConfig.position = {
    x: config.position.x + offsetX,
    y: config.position.y + offsetY,
    z: config.position.z,
  }
  const shapeTop = {
    x: config.position.x,
    y: config.position.y + 1.9,
    z: config.position.z,
  }
  const buttonEdge = {
    x: buttonConfig.position.x - geometry.width * 0.5 * scalar,
    y: buttonConfig.position.y,
    z: buttonConfig.position.z,
  }
  const join = {
    x: shapeTop.x,
    y: buttonEdge.y,
    z: (shapeTop.z + buttonEdge.z) / 2,
  }
  lineX = {
    lineWidth: 10,
    path: AFRAME.utils.coordinates.stringify(buttonEdge) + ',' + AFRAME.utils.coordinates.stringify(join),
    color: '#fff',
  }
  lineY = {
    lineWidth: 10,
    path: AFRAME.utils.coordinates.stringify(shapeTop) + ',' + AFRAME.utils.coordinates.stringify(join),
    color: '#fff',
      }
    }
  }
  let dragStart = (e) => {
    console.log(e)
  }
  let params = {
    'hotspots-button': 'text:' + (button.label != null ? button.label : '') + ';' + 'icon:' + (button.icon != null ? button.icon.preview : '') + ';',
    draw: 'width:256; height:' + (button.icon != null ? '256' : '128') + ';',
  }
  return (
    <Entity className='hotspot button' {...params} >
      <Entity
        className='hotspot button'
        primitive='a-image'
        look-at='[camera]'
        {...{geometry}}
        scale={config.scale}
        position={editingHotspot.shape ? buttonConfig.position : config.position}
      />
      {
        editingHotspot.shape &&
          <Entity>
            <Shape config={config} editingHotspot={editingHotspot}/>
            <Entity meshline={lineX}/>
            <Entity meshline={lineY}/>
          </Entity>
      }
    </Entity>
  )

Answer 1

据我所知，凯文的事件集组件设置了目标/自我属性(他的非限制区域的第121行(，这意味着它无法调用方法(除了update，每当更改属性时称为(

我会在我的组件中或只是听众 ->呼叫者

AFRAME.registerComponent("listener", {
  init: function() {
     this.el.addEventListener("startDrag", (e)=> {
        // call your function here.
        // if you want to call another component's function, you can do
        // this.el.components.componentWithMethod.method()
     }
  }
}

类似的东西。