Question

我正在使用Symfony 4，VueJs 2和Axios与Ajax发送表单。表单发送时没有明显问题，但似乎表单的输入数据并未随表单发送。

好奇心：我做到了，但是使用jQuery Ajax并能正常工作。

我已经尝试过该2017年解决方案，但不适用于我：POST Requests with axios not sending parameters

index.html

<form id="form" @submit.prevent="sendForm">
    <input type="text" v-model="name">
    <input type="submit" value="Send">
</form>

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script>
    let form = new Vue({
        el: "#form",
        data: {
            name: ""
        },
        methods: {
            sendForm: function () {
                axios
                    .get("/send", this.data)
                    .then(response => console.log(response.data))
            }
        }
    });
</script>

homeController.php

namespace App\Controller;

use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Routing\Annotation\Route;

class HomeController extends AbstractController {
    /**
     * @Route("/", name="home")
     */
    public function index() {
        return $this->render('home/index.html.twig');
    }

    /**
     * @Route("/send", name="send")
     */
    public function sendForm(Request $request) {
        $name = $request->query->get("name");
        return new Response($name);
    }
}

Answer 1

在Symfony中尝试：$request->getContent()。

示例：

// ...
class HomeController extends AbstractController {
    //...
    /**
     * @Route("/send", name="send")
     */
    public function sendForm(Request $request) {
        // Decode data with json_decode()
        $data = json_decode($request->getContent(), true);
        $name = $data['name'];

        return $this->json($name);
    }
    //...
}

享受！

Symfony + VueJs + Axios =没有发送表单参数

1 个答案: