A-Frame场景中如何禁用360视角的触摸look-controls控制？

你遇到的问题是因为直接设置look-controls="enabled: false"会禁用所有视角控制（包括设备姿态），正确的做法是单独禁用触摸和鼠标控制，同时保留设备姿态控制：

修正后的代码 #

<a-scene ref={sceneRef} className="h-full" vr-mode-ui="enabled: false">

  <a-assets>
    <img id="360image" src={srcImg360} />
    <audio id="360audio" src={srcAudio360} preload="auto" />
  </a-assets>

  <a-sky
    ref={sphereRef}
    id="image-360"
    radius="10"
    src="#360image"
  ></a-sky>

  <a-entity
    camera
    look-controls="mouseEnabled: false; touchEnabled: false; deviceOrientationEnabled: true"
    ref={cameraRef}
  ></a-entity>

</a-scene>

关键说明 #

• 移除enabled: false，这个属性会一次性禁用所有视角控制方式
• 明确设置deviceOrientationEnabled: true，强制启用手机姿态感应控制
• 保持mouseEnabled: false和touchEnabled: false，禁用触摸和鼠标拖动视角

测试注意事项 #

• Android设备上测试时，确保使用支持设备方向API的浏览器（如Chrome），且页面运行在HTTPS环境下（部分浏览器限制非安全上下文使用设备姿态）
• Windows桌面环境下没有设备姿态硬件，所以视角不会变化，这是正常现象，需在真实移动设备上验证效果

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