SOURCE

const counter = {
        props: ['count'],
        template: `<div @click="add">{{num}}</div>`,
        data: function() {
            return {
                num: this.count
            }
        },
        methods: {
            add: function() {
                this.num += 2
                this.$emit('add', 2)
            }
        }
    }

    const vm = new Vue({
        el: '#app',
        data: {
            total: 1
        },
        components: {
            counter
        },
        methods: {
            addNum: function(step) {
                this.total += step
            }
        }
    })

<div id="app">
    <counter :count="0" @add="addNum"></counter>
    <counter :count="1" @add="addNum"></counter>
    <div>{{total}}</div>
</div>

body {
    font-size: 32px
}