Increase speed by 1 every 20 points game

I am using Vuex in Vue to make a game. I want the speed to increase every 20 points.

I facing troubles with connecting the module with getters, how do I solve this?

My goals is for the speed to increase by 1, every time the user scores 20 points. Before I had a input field to manually edit the speed. Problem now is the speed does not get updated.

Here is my main component

    <template>
  <div id="game">
    <game-canvas
      :cellSize="cellSize"
      :boardSize="boardSize"
      :isPlaying="isPlaying"
      :stop="stop"
    />
    <p class="points">Points: {{ score }}</p>
    <button id="play-btn" @click="isPlaying ? stop() : start()">
      {{ isPlaying ? 'Stop' : 'Play' }}
    </button>
    <section class="settings">
        <p number="cellSize" />
      </div>
        Zoom
        <input type="number" min="10" v-model.number="boardSize" />
      </div>
      <p>Speed {{ speed }}</p>
    </section>
  </div>
</template>
<script>
  import GameCanvas from './GameCanvas.vue'
  import Store from '../../store/modules/moduleC.js'
  import { mapGetters } from 'vuex'

  export default {
    name: 'GameApp',
    components: {
      GameCanvas
    },
    data() {
      return {
        cellSize: 25,
        boardSize: 20,
        isPlaying: false
      }
    },
    computed: {
      ...mapGetters('c', {
        speed: 'speed'
      }),
      score() {
        return Store.state.score
      }
    },
    methods: {
      start() {
        this.isPlaying = true
      },
      stop() {
        this.isPlaying = false
      }
    }
  }
</script>

store/modules/moduleC.js

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)

export default new Vuex.Store({
  namespaced: true,
  state: {
    score: 0
  },
  getters: {
    speed(state) {
      Math.ceil(state.score / 20) || 1
    }
  },
  mutations: {
    increment: state => state.score++,
    reset: state => (state.score = 0)
  },
  actions: {},
  modules: {}
})


Read more here: https://stackoverflow.com/questions/66276744/increase-speed-by-1-every-20-points-game

Content Attribution

This content was originally published by EST201 at Recent Questions - Stack Overflow, and is syndicated here via their RSS feed. You can read the original post over there.

%d bloggers like this: