title: Passing argument into $emit returning undefined
body: <p>I have a simple app that captures whatever is in an input, and prints it in a h1.</p>
  
  <pre><code>&lt;div id="app"&gt;  
    &lt;div&gt;
      &lt;module v-on:button-pressed="parentPrint(capturedInput)"&gt;&lt;/module&gt;
    &lt;/div&gt;
    &lt;h1&gt;{{ h1Text }}&lt;/h1&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The problem is, the h1 will not update to reflect the input value. </p>
  
  <pre><code>Vue.component('module', {
    template:`
      &lt;div&gt;
        &lt;input type="text" placeholder="Type Something Awesome" v-model="capturedInput" /&gt;
        &lt;button v-on:click="activateButtonPress"&gt;Change text&lt;/button&gt;
      &lt;/div&gt;
    `,
    data(){
      return {
        capturedInput: ''
      }
    },
    methods:{
      activateButtonPress: function(){
        console.log(this.capturedInput)
        this.$emit('button-pressed', this.capturedInput)
      }
    }
  })
  
  new Vue({
    el:'#app',
    data:{
      h1Text: 'Should reflect user input'
    },
    methods:{
      parentPrint: function(capturedInput){
        this.h1Text = capturedInput;
  
      }
    } 
  })
  </code></pre>
  
  <p>How do I actually pass data into the emit and have it available in the parent scope? <code>capturedInput</code> keeps returning <code>undefined</code> for me.</p>