Saturday, 27 May 2017

How do you get data from form in Vue template?

I just want to send POST request to my server using fetch but since I'm kinda new to Vuejs I'm not sure how to get data from data. my pug code is like this below

<template lang="pug">
.wrapper
  .container
    h1 CNTRL
    form(v-on:submit.prevent='onSubmit').form
      input(type='text', placeholder='Username', v-model='id')
      input(type='password', placeholder='Password', v-model='password')
      button#login-button(type='submit') Login
</template>

This Is what I wrote on script section but It doesn't work. I don't know what's wrong with this.

export default {
    data () {
        id: '',
        password: ''
    },
    created () {
      // Set $route values that are not preset during unit testing
      if (process.env.NODE_ENV === 'testing') {
        this.$route = {
          name: 'landing-page',
          path: '/landing-page'
        }
      }
    },
    methods: {
        onSubmit() {
            fetch('/signup', {
                method: 'POST',
                body: JSON.stringify({
                    id: this.id,
                    password: this.password
                })
            })
        }
    },

  }



via Phillip YS

No comments:

Post a Comment