0

我正在尝试列出可用的游戏手柄并在可用的游戏手柄中选择一个游戏手柄。当select this gamepad按下按钮时,游戏手柄列表将不可见,只有选定的游戏手柄可见。

我试图这样做v-if

<div v-if="selectedGamepad != null">
  {{selectedGamepad.axes}}
</div>
<div v-if="selectedGamepad == null">
  <div class="gamepad" v-for="gamepad in gamepads">
    {{gamepad.id}}
    <button v-on:click="selectedGamepad = gamepad;">Select This Gamepad</button>
  </div>
</div>

但是当我按下按钮时,selectedGamepad值不会动态变化。因为当我按下按钮时,Vuejs 不会渲染gamepads loop.

但是如果gamepads loop可见selectedGamepad值动态变化。(如果您删除v-ifon gamepads loop

我不明白为什么v-for="gamepad in gamepads"效果selectedGamepad

如果我使用v-show而不是v-if一切正常,但我不想gamepads在按下按钮后渲染。

您可以从此处查看完整示例:https ://jsfiddle.net/eywraw8t/518811/

我认为问题与Gamepad对象有关。IfselectedGamepad是一个Gamepad对象 Vuejs 不能动态渲染。但是如果selectedGamepad是一个array(例如轴数组)一切正常。但我不知道如何Gamepad正确渲染对象。

4

0 回答 0