Question

使用 Axios 时出现问题。因此，在这里我想弄清楚 Axios 方法在做什么。

反应状态数据

这是我作为发布数据传递的数据对象。

const data = qs.stringify({
            recipe_name: inputs.recipe_name,
            total_serve: inputs.total_serve,
            ingrediants: ingrediants,
            directions: directions
        });

Axios

axios.post(
                'http://example.com/api/add', 
                { data },
                { headers: { 'content-type': 'application/x-www-form-urlencoded' }}
            )
            .then(response => {
                console.log(response);
            })
            .catch(function (error) {
                console.log(error);
            });

回复：我已在服务器端打印了帖子数据。这是问题，发布数据在服务器上没有达到预期。

Array
(
    [{"data":"recipe_name] => Poha
    [total_serve] => 10
    [ingrediants] => Array
        (
            [0] => Array
                (
                    [name] => Ing 1
                    [measure] => 5
                )

        )

    [directions] => Array
        (
            [0] => Array
                (
                    [title] => Direction 1
                    [description] => abc Test Hello test"}
                )

        )

)

像这样开始

[{"data":"recipe_name] => Poha

并以此结尾

[description] => abc Test Hello test"}

我希望得到如下结果：

Array
(
    [recipe_name] => Poha
    [total_serve] => 10
    [ingrediants] => Array
        (
            [0] => Array
                (
                    [name] => Ing 1
                    [measure] => 5
                )

        )

    [directions] => Array
        (
            [0] => Array
                (
                    [title] => Direction 1
                    [description] => abc test Hello Test
                )

        )

)

我想弄清楚我使用Axios方法做错了什么。

Answer 1

我想你的问题在这里

const data = qs.stringify({
   recipe_name: inputs.recipe_name,
   total_serve: inputs.total_serve,
   ingrediants: ingrediants,
   directions: directions
});

您无需将数据转换为字符串

尝试发送原始对象

const data = {
   recipe_name: inputs.recipe_name,
   total_serve: inputs.total_serve,
   ingrediants: ingrediants,
   directions: directions
};

如何使用axios在发布请求中传递ReactJS状态数据时解决问题？

1 个答案: