简体   繁体   English

获得不变违规:对象作为React子项无效

[英]Getting Invariant Violation: Objects are not valid as a React child

My code doesn't work, it always returning 我的代码不起作用,它总是返回

Invariant Violation: Objects are not valid as a React child (found: object with keys {_40, _65, _55, _72}). 不变违规:对象无效作为React子对象(找到:具有键{_40,_65,_55,_72}的对象)。 If you meant to render a collection of children, use an array instead. 如果您要渲染子集合,请使用数组。

is there any wrong syntax or logic in there? 那里有任何错误的语法或逻辑吗? here is my code: 这是我的代码:

const asyncTest1= async() => {
    try {
        noteAction({ type: SET_LOADING, payload: true });
        const response = new Promise((resolve, reject) => {
            setTimeout(() => {
                resolve('Async Test Load');
            }, 3000);
        });
        const adding = noteAction({ type: ADD_NOTE, payload: response });
        const setLoadingFalse = noteAction({ type: SET_LOADING, payload: false });
        const result = await Promise.all([response, adding, setLoadingFalse]);
        return result;
    } catch (e) {
        console.log(e);
    }
};

but with no async/await version, my code is working: 但是没有async / await版本,我的代码正在运行:

  const asyncTest2= () => {
        try {
            noteAction({ type: SET_LOADING, payload: true });
            const result = new Promise((resolve, reject) => {
                setTimeout(() => {
                    resolve('Async Test Load');
                }, 3000);
            });
            return result
            .then(response => noteAction({ type: ADD_NOTE, payload: response }))
            .then(response => noteAction({ type: SET_LOADING, payload: false }));
        } catch (e) {
            console.log(e);
        }
    };

but with no async/await version, my code is working 但没有async / await版本,我的代码正在运行

The equivalent of that with async / await syntax would not use any Promise.all , it would be 使用async / await语法的等价物不会使用任何Promise.all ,它会是

const asyncTest2 = () => {
    try {
        noteAction({ type: SET_LOADING, payload: true });
    } catch (e) {
        console.log(e);
    }
    var result = new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve('Async Test Load');
        }, 3000);
    });
    var response = await result;
    var response = await noteAction({ type: ADD_NOTE, payload: response }));
    return noteAction({ type: SET_LOADING, payload: false }));
};

I can't tell whether this is what you actually want, but at least it would work the same as the then version. 我不知道这是否是你真正想要的,但至少它会和then版本一样。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM