Tenho o seguinte código abaixo utilizando Vue.js e Vuex. Este código incrementa e decrementa valor como um contador. Gostaria de saber ao que se refere o método count
dentro de computed na instância Vue. Sei que ele retorna o estado da váriavel count do state
. Mas pq o nome do método tem que ser o nome da variável? Se eu troco o nome do método o código não funciona.
const store = new Vuex.Store({
state: {
count: 0
},
mutations: {
incrementa: state => state.count++,
decrementa: state => state.count--
}
})
new Vue({
el: '#app',
computed: {
count() { // Dúvida -> ao que se refere count
return store.state.count
}
},
methods: {
incrementa() {
store.commit('incrementa')
},
decrementa() {
store.commit('decrementa')
}
}
})
span{padding: 0 15px;}
<script src="https://unpkg.com/[email protected]/dist/vuex.js"></script>
<script src="https://unpkg.com/[email protected]/dist/vue.js"></script>
<div id="app">
<p>
<button @click="incrementa">+</button>
<span>{{ count }}</span>
<button @click="decrementa">-</button>
</p>
</div>