JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//unpkg.com/vue/dist/vue.js"></script>

<div id="app">
  <compo :data="data" :before-process="beforeProcess"></compo>
</div>

JavaScript

Vue.component('compo', {
  template: `
    <button @click="handleClick">click</button>
  `,
  props: {
    beforeProcess: Function,
    data: Object
  },
  methods: {
    handleClick() {
      this.beforeProcess();
      console.log('data in child component:', JSON.stringify(this.data));
    }
  }
})
var Main = {
  data() {
    return {
      data: {}
    }
  },
  methods: {
    beforeProcess() {
      this.data.name = 'test';
      console.log('data in parent component:', JSON.stringify(this.data));
    }
  }
}
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')