title: vuejs input value is undefined
body: <p>i'm currently learning vuejs by making a login app however i can access the value of input it gave me undefined , i'm clearly doing something wrong here but i cant find where i'm mistaken here is my code , can u point me to the right direction 
  here is the code </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var app = new Vue({
    el: '#app',
    data() {
      return {
  
        username: "",
        password: ""
  
      }
    },
    methods: {
      login() {
        console.log(this.username)
      },
    }
  
  })</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="app"&gt;
    &lt;div class="main"&gt;
      &lt;div class="left"&gt;
        &lt;h1&gt;Login&lt;/h1&gt;
        &lt;p&gt;&lt;i&gt;To your Account&lt;/i&gt;&lt;/p&gt;
        &lt;form @submit.prevent="login"&gt;
          &lt;input type="text" name="username" v-model="username" placeholder="Username" /&gt;
          &lt;input type="password" name="password" v-model="password" placeholder="Password" /&gt;
          &lt;input type="submit" value="LOG IN"&gt;
  
        &lt;/form&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  
  
  &lt;/div&gt;
  
  
  &lt;script src="https://cdn.jsdelivr.net/npm/vue@2.6.0"&gt;&lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>thank you in advance </p>