JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://unpkg.com/vue@latest/dist/vue.js"></script>
<div id="app">
  <super-form ref="child"></super-form>
</div>

<button id="btn-change">
  change text
</button>

JavaScript

Vue.component("super-form", {
  template: `<div>
  	<input v-model='input'>
    <span>{{number}}</span>
   </div>`,
  data: function() {
    return {
      input: 'aaaaa',
      number: 0
    }
  },
  watch: {
    input: function(newText) {
      this.doSomeAjax()
    }
  },
  methods: {
    doSomeAjax: function() {
      var self = this;
      setTimeout(function() {
        self.number = Math.random()
      }, 1000)
    }
  }
})

var vm = new Vue({
  el: '#app',
})

var btn = document.getElementById("btn-change")
btn.addEventListener("click", function() {
  vm.$refs.child.input = "changed!"
})