SOURCE

console 命令行工具 X clear

                    
>
console
Vue.component("button-counter", {
  name: 'child',
  template: '<button v-on:click="add">{{ counter }}</button>',
  props: {
    counter:{
      type:Number,
      default:0,
    }
  },
  data () {
    return {
      newCounter: 0
    }
  },
  methods: {
    add () {
      this.newCounter = this.counter + 1;
      console.log('oldCounter:'+this.counter)
      console.log('newCounter:'+this.counter)
  		this.$emit('add1', this.newCounter)
    }
	}
})

new Vue({
  el: "#app",
  data () {
  	return {
      counter: 0
    }
	},
  methods: {
    incrementTotal: function (e) {
      e = this.counter
      console.log('father:'+this.counter)
      // this.total += 1
    }
  }
})
<div id="app">
  {{ counter }}
<button-counter :counter="counter" @add1="incrementTotal"></button-counter>

<button-counter :counter="counter" v-on:add1="incrementTotal"></button-counter>
</div>

本项目引用的自定义外部资源