为什么我的A-Frame项目中进入VR的按钮消失或错位？

Question

我正在使用A-Frame，但是我无法看到通常位于右下角的“进入VR”按钮。因此，我无法进入VR或全屏模式。

如何让它显示出来？

- ngokevin

Answer 1

如果您的场景被包装在一个<div>中，那么您可能需要调整容器的样式。默认情况下，<a-scene>是相对定位的。画布和“进入VR”按钮默认为绝对定位。

如果您正在使用要求渲染容器的React或者将其放在div中的嵌入场景，这种情况很常见。

尝试设置容器样式position: absolute;height: 100%;width: 100%;。

- ngokevin

---

@ngokevin - 这正是我在vue.js中遇到的问题，而且我已经解决了这个问题。但是在A-Frame 0.7.1中，将容器的高度设置为100％会破坏桌面上的抓取/移动行为（即使使用pointer-events：none），并覆盖我的检查器视图。 - TimHayes

Answer 2

使用React时，我只需告诉初始渲染使用document.body而不是创建一个容器/ div元素来容纳我的AFrameReact组件。这对我解决了问题，进入VR模式按钮再次变得可见。

完整示例： ReactDOM.render(<World />,document.body);

- Rolley