vue_表单实例

vue_表单实例

<div id="app">
    <form @submit.prevent="submit">
        <div class="field">
            姓名：<input type="text" v-model="user.name">
        </div>
        
        <div class="field">
            性別：
            <label>
                <input type="radio" value="男" v-model="user.gender"> 男
            </label>
            <label>
                <input type="radio" value="女" v-model="user.gender"> 女
            </label>
        </div>
        
        <input type="submit" value="提交">
    </form>
</div>

<script>

   new Vue({

       el: '#app',
       data: {
           user: {
               name: '',
               gender: ''
           }
       },
       methods: {
           submit: function() {
               var formData = JSON.stringify(this.user); // 这里才是你的表单数据

               this.$http.post('/path/to', formData).then((response) => {
                   // success callback
               }, (response) => {
                   // error callback
               });
           }
       }

   })
</script>

 

posted on 2017-02-05 14:08 木子炜培先生 阅读( ...) 评论( ...) 编辑 收藏

转载于:https://www.cnblogs.com/liadmin/p/6367510.html