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

<template>
  <form @submit="submitForm">
    <input type="text" v-model="name" placeholder="Name">
    <input type="email" v-model="email" placeholder="Email">
    <button type="submit">Submit</button>
  </form>
</template>

<script>
export default {
  data() {
    return {
      name: '',
      email: '',
    };
  },
  methods: {
    submitForm() {
      // 在这里发送HTTP请求
    },
  },
};
</script>

import axios from 'axios';

// ...

methods: {
  submitForm() {
    const formData = {
      name: this.name,
      email: this.email,
    };

    axios.post('/api/submit-form', formData)
      .then(response => {
        // 处理响应
      })
      .catch(error => {
        // 处理错误
      });
  },
},

'use strict';

const { validate } = use('Validator');

class FormController {
  async submitForm({ request, response }) {
    const rules = {
      name: 'required',
      email: 'required|email',
    };

    const validation = await validate(request.all(), rules);

    if (validation.fails()) {
      return response.status(400).json(validation.messages());
    }

    // 处理表单数据
    const { name, email } = request.all();

    // 返回响应
    return response.status(200).json({ message: 'Form submitted successfully' });
  }
}

module.exports = FormController;