Aフレームのvr-mode-uiを動的に切り替えます

Question

私のコードでAフレームのvr-mode-uiを動的にいくつかのルールに基づいて表示/非表示しようとしています。 Initally <a-scene>は次のようになります。私のコントローラで

<a-scene id="vr-scene" vr-mode-ui="enabled: false"> 

、私はフラグに基づいて、それを有効または無効にしようとしています：

let scene = document.querySelector('#vr-scene'); 
if (showVR) { 
    scene.setAttribute('vr-mode-ui', 'enabled: true'); 
} else { 
scene.setAttribute('vr-mode-ui', 'enabled: false'); 
} 

しかし、このトグルが起こる瞬間、私は上のエラーを取得しますコンソールは次のようになります： TypeError: Cannot read property 'removeChild' of null

ここで間違っていることをお伝えください。 VRボタンを有効/無効にするより良い方法はありますか？ここで

は簡単codepenです：https://codepen.io/anon/pen/BdZWdz

ステップ：

1. クリックし
2. を有効化、無効化
3. をクリックして、現在（VRボタンが起動しない）

Answer 1

を有効にする]をクリックしますコンポーネントはボタンの多くを有効/無効にすることをサポートしていません。一度だけのことのほうが多い。これは修正できますが、問題が発生します。一方

、単にCSSを使用して、ボタンの表示を切り替えることが容易になるだろう：

document.querySelector('.a-enter-vr-button').style.visible = 'none';