Question

因此，我的Vue组件要求用户输入他的电子邮件。我正在使用v-model进行数据绑定。

<template>
    <input v-model="email" type="text" placeholder="Email" />
    <button class="tiny">Send</button>
</template>
<script>
    export default {
        data: function () {
            return {
                email: ''
            }
        }
    }
</script>

Adonis中的我MailController应该能够接收用户的电子邮件作为输入。我想象过这样的事情：

'use strict';

class MailController {
    *mail (request, response) {
     const email = request.input('email');
    }
}

获取email的正确方法是什么？

Answer 1

1。）npm install vue-resource --save

2。）在vue的主要js文件中

var Vue = require('vue');
var VueResource = require('vue-resource');

Vue.use(VueResource);

3.。）像这样更改您的组件文件

<template>
    <input v-model="email" type="text" placeholder="Email" />
    <button @click="submit()" class="tiny">Send</button>
</template>

<script>
    export default {
        data: function () {
            return {
                email: ''
            }
        },

        methods: {
            submit: function() {
                this.$http.post('/your-url', {email: this.email})
                    .then(
                        (response) => {
                            console.log(response);
                        },

                        (error) => {
                            console.log(error);
                        }
                    );
            }
        }
    }
</script>

如何使用http请求将Vue表单输入发送到Adonis控制器

1 个答案: