Vue JS смонтирован() - программирование

Я создаю игру в VueJS, где, когда загружается страница, я хочу, чтобы метод срабатывал, делал вызов ajax внешнему API и создавал кучу свойств данных. Когда игрок выигрывает раунд, я хочу, чтобы они могли видеть кнопку, которая позволяет им перезапустить игру. Я использую hook mounted() для запуска метода на загрузке страницы.

Мой вопрос: я не уверен, как реализовать функцию перезапуска, если настройка игры и вызов API находятся в функции mounted(). Есть ли способ снова запустить функцию mounted()?

Ответы

Ответ 1

Представьте свою инициализацию в методе и вызовите метод из mounted и в любом другом месте.

new Vue({
  methods:{
    init(){
      //call API
      //Setup game
    }
  },
  mounted(){
    this.init()
  }
})

Тогда, возможно, у вас есть кнопка в шаблоне, чтобы начать все заново.

<button v-if="playerWon" @click="init">Play Again</button>

В этой кнопке playerWon представляет собой логическое значение в ваших данных, которое вы установили, когда игрок выиграет игру, чтобы кнопка появилась. Вы вернете значение false в init.