Всем привет. Уже написал пару простых SPA на vue.js, активно его изучаю. Встал вопрос с использованием vue в простых сайтах.
Если быть точнее, то не понимаю, как из одного компонента передать событие в другой? К примеру, есть кнопка добавления товара, на клик по которой мне необходимо вызывать метод addProduct в компоненте Cart. Как правильно это сделать?
//main.js:
import Vue from 'vue'
import Cart from './components/Cart.vue'
const app = new Vue({
el: '#app',
components: {ExampleComponent}
});
HTML:
<div id="app">
<cart></cart>
</div>
Cart.vue:
<template>
<div id="cart">
</div>
</template>
<script>
export default {
data: function() {
return {
items: []
}
},
methods: {
addProduct: function (id) {
//console.log('Adding product ' + id)
},
reduceProduct: function (id) {
//console.log('Reducing product ' + id)
},
removeProduct: function (id) {
//console.log('Removing product ' + id)
}
},
mounted() {
console.log('Component mounted.')
}
}
</script>