VueJs, wie man Daten aus Vue.Komponente

In Vue.js Eltern-Kind-Beziehung wird von

1) die übergabe der Requisiten von den Eltern auf das Kind

2) emitting benutzerdefinierte Ereignisse vom Kind zum Elternteil

Also, wenn Sie brauchen, um einige Daten von Kind zu Eltern - verwenden this.$emit emittieren Sie ein benutzerdefiniertes Ereignis mit Ihren Daten aus, und warten Sie auf dieses Ereignis im übergeordneten Komponente mit v-on:myevent oder @myevent Kürzel. Die Daten übergeben Sie mit Ereignis fand in $event variable.

Beispiel: https://jsfiddle.net/wostex/63t082p2/51/

<div id="app">
  <myform @newdata="handleData($event)"></myform>
  <p>name: {{ user.name }}</p>
  <p>age: {{ user.age }}</p>
</div>

new Vue({
  el: '#app',
  data: {
    user: { name: '', age: 0 }
  },
  methods: {
    handleData: function(e) {
      [this.user.name, this.user.age] = e;
    }
  },
  components: {
    'myform': {
      template: `
      <div>
      <input type="text" v-model="formData.name" placeholder="Your name">
      <input type="number" v-model.number="formData.age">
      </div>`,
      data: function() {
        return { formData: { name: '', age: 0 } }
      },
      watch: {
        formData: {
            handler: function() {
              this.$emit('newdata', [this.formData.name, this.formData.age]);
          },
            deep: true
        }
      }
    }
  }
});