Vuejs и HTML5 Gamepad API: как визуализировать объект Gamepad? - PullRequest
Новая
       82

Vuejs и HTML5 Gamepad API: как визуализировать объект Gamepad?

0 голосов
/ 25 декабря 2018

Я пытаюсь перечислить доступные геймпады и выбрать геймпад в доступных геймпадах.Когда нажата кнопка 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-if на gamepads loop)

Я не понимаю, почему v-for="gamepad in gamepads" влияет на selectedGamepad.

Если я использую v-show вместо v-if, все работает нормально, но я не хочу отображать gamepads после кнопкинажата.

Полный пример вы можете увидеть здесь: https://jsfiddle.net/eywraw8t/518811/

Я думаю, что проблема связана с объектом Gamepad.Если selectedGamepad является Gamepad объектом, Vuejs не может визуализироваться динамически.Но если selectedGamepad - это array (например, массив осей), все работает нормально.Но я не могу понять, как правильно отобразить Gamepad объект.

...