VueJs组件之父子通讯的方式(5)

<script src="https://unpkg.com/vue"></script>
<!--ref在里面的元素上--全局注册-->
<div id="ref-inside-dom-all">
 <ref-inside-dom-quanjv></ref-inside-dom-quanjv>
</div>
<script>
 //v-on:input指当input里值发生改变触发showinsideDomRef事件
 Vue.component("ref-inside-dom-quanjv", {
  template: "<div class='insideFather'> " +
   "<input type='text' ref='insideDomRefAll' v-on:input='showinsideDomRef'>" +
   " <p>ref在里面的元素上--全局注册 </p> " +
   "</div>",
  methods: {
   showinsideDomRef: function() {
    console.log(this); //这里的this其实还是div.insideFather
    console.log(this.$refs.insideDomRefAll); // <input type="text">
   }
  }
 });
 var refinsidedomall = new Vue({
  el: "#ref-inside-dom-all"
 });
</script>