时间戳

首页 > 解决方案 > 从地图内的对象函数返回值

reactjs - 从地图内的对象函数返回值

问题描述

我正在尝试运行一个getUserName函数，该函数在 Observable 管道、地图和另一个地图中被调用。我可以返回一个值，但我似乎无法将传递的数组映射到然后过滤掉 item.name 如果它与传入的 id 匹配。如果我显示代码可能会更容易理解：

不工作：

   export const fetchDesignsData = (usersArray: [Users]) => (dispatch: Dispatch<Action>) => {
    console.log(usersArray);

    const DESIGNS_URL = `http://localhost:5000/designs`;
    dispatch({
        type: "FETCH_DATA_REQUEST",
    });
    const responsePromise = axios.get(DESIGNS_URL);
    const response$ = from(responsePromise);
    response$
        .pipe(
            map((response) => {
                const newArray: { name: string; courses: number; wales: number; last_updated: string; by: any }[] = [];
                response.data.map((item: { name: any; courses: any; wales: any; updated: any; user_id_last_update: any }) => {
                    return newArray.push({
                        name: item.name,
                        courses: item.courses,
                        wales: item.wales,
                        last_updated: item.updated,
                        by: getUserName(item.user_id_last_update, usersArray),
                    });
                });
                dispatch({
                    type: "FETCH_DATA_SUCCESS",
                    payload: newArray,
                });
            })
        )
        .subscribe();
};

    const getUserName = (userNumber: number, usersArray: [Users]) => {
        return () => {
            usersArray.forEach((item) => {
                if (item.id === userNumber) {
                    return item.name;   
                }
            });
        };
    };

基本上 usersArray 看起来像这样：

[{id: 1, name: "Walter Doe"},
{id: 2, name: "John Doe"}]

所以我需要映射该数组，然后查看 item.id === userNumber，如果是，则返回 item.name。但它每次都返回空白。可能是因为它在 Observable 内部

标签： reactjstypescriptreduxobservablethunk

解决方案

您需要使用过滤器，因为您需要返回满足条件的数组。

//...
const getUserName = (userNumber: number, usersArray: [Users]) => {
    return () => {
        usersArray.filter((item) => item.id === userNumber)
                  .map(item => item.name)
        });
    };
};
//...

推荐阅读