首页 > 解决方案 > 遇到错误'动作必须是普通对象。使用自定义中间件进行异步操作'

问题描述

我已经查看了类似这样的线程,但它似乎对我相当奇怪的问题没有帮助。

以下是3种相关方法。

const createFormData = post => {
    const {
        title,
        body,
        image
    } = post;

    const data = new FormData();

    data.append(
        "body",
        JSON.stringify({
            title,
            body,
            mediaType: image.type
        })
    );

    console.log(data); // prints

    return data;
};

const submitMedia = (data, replace) => async dispatch => {
    console.log('reached'); // never prints

    dispatch({
        type: SUBMITTING
    });

    try {
        const response = await axios.post(
            `http://${GATEWAY}:5000/api/uploads/single`,
            data
        );

        dispatch({
            type: SUBMISSION_PENDING
        });

        replace("NewSubmission", {
            name: "NewSubmission"
        });
    } catch (err) {
        // TODO test this
        dispatch({
            type: SUBMISSION_FAIL,
            payload: err.response.data
        });

        alert("Uh oh", "Something went wrong");
        console.log("Error caught", err);
    }
};

const handleSubmit = async () => {
    try {
        const post = {
            title,
            body,
            image
        };

        const data = createFormData(post);

        console.log('reached'); // never prints

        submitMedia(data, replace);
    } catch (err) {
        console.log("err caught --> ", err);
    }
};

我的程序似乎正确地构建了表单数据,但它几乎就像它从不退出createFormData(post)方法一样。不确定从这里开始,我已经尝试将方法包装为这个答案所暗示的闭包,但没有骰子。我什至尝试将异步移出handleSubmit(),仍然没有。不知道我做错了什么。

标签: reactjsreact-nativereduxreact-redux

解决方案


推荐阅读