JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.min.js"></script>
<div id="app"></div>

JavaScript

let Child = {
	name: 'child',
  template: '<div><span>{{ localMsg }}</span><button @click="change">click</button></div>',
  data: function() {
  	return {
    	localMsg: this.msg
    }
  },
  props: {
  	msg: String
  },
  methods: {
  	change() {
    	this.$emit('update:msg', 'world')
    }
  }
}

new Vue({
	el: '#app',
  template: '<child :msg.sync="msg"><child>',
  beforeUpdate() {
  	alert('update twice')
  },
  data() {
  	return {
    	msg: 'hello'
    }
  },
  components: {
  	Child
  }
})