自定义AFrame光标Primitive中raycaster的objects字段失效

问题出在两个关键细节上：

• cursor组件的fuseTimeout类型错误：AFrame要求该属性为数值类型，你在Primitive配置中使用了字符串'500'，可能导致组件初始化异常，干扰raycaster的关联逻辑。
• 组件初始化顺序影响：需确保raycaster组件先于cursor组件声明，避免cursor初始化时覆盖raycaster的配置。

修正后的自定义Primitive代码：

AFRAME.registerPrimitive('a-animated-cursor', {
  defaultComponents: {
    // 先声明raycaster，确保cursor组件能正确读取其配置
    raycaster: {
      objects: '.clickable'
    },
    cursor: {
      rayOrigin: 'mouse',
      fuseTimeout: 500 // 改为数值类型
    },
    geometry: {
      primitive: 'ring',
      radiusOuter: 0.016,
      radiusInner: 0.01,
      segmentsTheta: 32
    },
    material: {
      color: 'white',
      shader: 'flat',
      opacity: 0.8
    },
    position: {
      x: 0,
      y: 0,
      z: -1
    },
    animation__click: {
      property: 'scale',
      startEvents: 'click',
      easing: 'easeInCubic',
      dur: 150,
      from: { x: 0.1, y: 0.1, z: 0.1 },
      to: { x: 1, y: 1, z: 1 }
    },
    animation__fusing: {
      property: 'scale',
      startEvents: 'fusing',
      easing: 'easeInCubic',
      dur: 1500,
      from: { x: 1, y: 1, z: 1 },
      to: { x: 0.1, y: 0.1, z: 0.1 }
    },
    animation__mouseleave: {
      property: 'scale',
      startEvents: 'mouseleave',
      easing: 'easeInCubic',
      dur: 500,
      to: { x: 1, y: 1, z: 1 }
    }
  },
  // 可选：添加属性映射，方便在HTML中直接修改raycaster的目标对象
  mappings: {
    'objects': 'raycaster.objects'
  }
});

额外检查项：

• 确认场景中目标对象已正确添加.clickable类，例如：<a-box class="clickable" position="0 1 -3"></a-box>
• 确保没有其他raycaster组件（如相机上的额外raycaster）干扰检测逻辑

内容的提问来源于stack exchange，提问作者Atlinx