Tengo el siguiente ejercicio donde declaro una nueva instancia de VueJS
let app = new Vue({
el: `#app`,
data: {
contador: 0
},
methods: {
aumenta() {
this.contador++
}
},
created() {
this.aumenta()
}
})
Antes de esta instancia, hago un componente global en el cual paso por medio de props tanto a contador como al método aumenta de tal suerte que deseo que el botón contenido en dicho componente tenga la lógica de aumentar en 1 dicho valor por medio del método en cuestión
Vue.component('precio-esquina', {
props: ['contador', 'aumenta'],
template: `
<div>
<button @click="aumenta()">+</button>
Llevas {{ contador }}
</div>
`
})
Finalmente invoco dicho componente dentro del alcance del div
de este modo:
<div id="app">
<precio-esquina></precio-esquina>
</div>
Pero obtengo el siguiente error:
vue:6 ReferenceError: aumenta is not defined
Entonces la pregunta:
¿Cómo paso un método declarado en la instancia de VueJS a un componente global?