Reactjs 比较贴图函数中的对象

我尝试根据道具呈现活动的映射列表。这些道具的布局如下：

completedActivity:
  message:
  status:
  time:
  type:
  progressId:
  time:
  userId:

我需要将

completedActivity.progressId

与另一套道具进行比较

logData:
  timestamp:
  taskRunId:
  userName:

我需要查看completedActivity.progressId=logData.taskRunId的位置。如果它们相同，我需要获取

logData.userName

下面是呈现活动的代码。它只是工作，但我需要添加额外的信息到他们。从现在起，它将呈现

activity.userId

，它是绑定用户，而不是实际用户。如果它们不相同，则需要呈现绑定用户

const ActivityList = props => {


const activityList = props.data.completedActivity.map(activity => (
    <li
        class="collection-item"
        onClick={() =>
            activity.messageDetails
                ? props.toggleMessageDetails(true, activity.messageDetails)
                : false
        }
    >
        <p>{activity.type}</p>
        <p className="message">{activity.message}</p>
        {/* 
            displays who last ran that activity and when they did. Need to come up with a better naming solution. 
        */}
        <div class="whodiditandwhen">
            <span>{activity.userId}
            </span>

            {/*<span>{activity.userId}</span>*/}
            <span>{new Date(activity.time).toLocaleString()}</span>
        </div>
        {/* 
            this will allow the user to click on the icon and see more detailed info on the activity. NOT ALL ACTIVITES HAVE THIS
        */}
        {activity.messageDetails}
    </li>
));
return (
    <ul className="activity-list">{activityList}
    </ul>
);};

---

这在某种程度上是可行的，只是它被多次渲染。

我能够在axios调用中解决这个问题，axios调用在页面渲染数据之前获取数据

export function getActivityUpdates(options, updateProgress) {
axios
    .post(URL, qs.stringify(options))
    .then(response => {
        // Null out saved currentActivityID if no live activity.
        handleCurrentActivityStorage(response.data.liveActivity);
        let changedIDs = [];
        let dataResponse = response.data;
        dataResponse.userId = ". . ."
        /*
        iterate over the completed activity and the log data.
        compare progress id to taskRunId.
        logData is from highest to lowest id.
        completedActivity is also from high to low but puts parents above children.
        check and make sure that it has a bind user written to it.
        Then if taskrunid is = to or less than the progressId. change it and add it to the changedIDs array.
        the ChangedIds array makes sure that ids are not iterated over multiple times.
        set the userID to the actual username found in the logs.
        */

        dataResponse.completedActivity.forEach(data => {

            options.logData.forEach(log => {

                //
                if (
                    data.userId === options.bindUsername &&
                    !changedIDs.includes(data.progressId) &&
                    (log.taskRunID === data.progressId ||
                    log.taskRunID < data.progressId)) {
                    changedIDs.push(data.progressId)
                    data.userId = log.magUserName;
                }
            })
        });
        updateProgress(dataResponse);

        // Exit function if a task is not running
        if (!response.data.liveActivity.length) {
            return;
        }


        // Get updated data every second until task is complete
        setTimeout(
            getActivityUpdates.bind(null, options, updateProgress),
            1000
        );
    })
    .catch(() => showErrorMessage(options.command));

导出函数GetActivityUpdate（选项，updateProgress）{ axios .post（URL、qs.stringify（选项）） 。然后（响应=>{ //如果没有活动，则清空保存的currentActivityID。 HandleCurrentActivityStore（response.data.liveActivity）； 让changedIDs=[]； 让dataResponse=response.data； dataResponse.userId=“…” /* 迭代完成的活动和日志数据。 将进度id与taskRunId进行比较。 日志数据从最高id到最低id。 完成的活动也从高到低，但把父母放在孩子之上。 检查并确保已向其写入绑定用户。 然后，如果taskrunid等于或小于progressId，则更改它并将其添加到changedIDs数组中。 ChangedIds数组确保不会多次迭代ID。 将userID设置为在日志中找到的实际用户名。 */ dataResponse.completedActivity.forEach（数据=>{ options.logData.forEach（log=>{ // 如果( data.userId==options.bindUsername&& ！changedIDs.includes（data.progressId）&& （log.taskRunID==data.progressId）|| log.taskRunID消息（options.command））；

---

}

你的问题到底是什么？@Code学徒我需要比较props.logData和props.completedActivity，看看TaskRunID的任何实例是否与progressId相同。如果它们是相同的，我需要获取props.logData.UserName的实例，并将其附加到activity.userId现在所在的位置。你试图做些什么来解决这个问题？您在编写过程中遇到了什么问题？请回答您的问题，这样您就可以对代码进行格式化以确保可读性。@code peedient Edited

export function getActivityUpdates(options, updateProgress) {
axios
    .post(URL, qs.stringify(options))
    .then(response => {
        // Null out saved currentActivityID if no live activity.
        handleCurrentActivityStorage(response.data.liveActivity);
        let changedIDs = [];
        let dataResponse = response.data;
        dataResponse.userId = ". . ."
        /*
        iterate over the completed activity and the log data.
        compare progress id to taskRunId.
        logData is from highest to lowest id.
        completedActivity is also from high to low but puts parents above children.
        check and make sure that it has a bind user written to it.
        Then if taskrunid is = to or less than the progressId. change it and add it to the changedIDs array.
        the ChangedIds array makes sure that ids are not iterated over multiple times.
        set the userID to the actual username found in the logs.
        */

        dataResponse.completedActivity.forEach(data => {

            options.logData.forEach(log => {

                //
                if (
                    data.userId === options.bindUsername &&
                    !changedIDs.includes(data.progressId) &&
                    (log.taskRunID === data.progressId ||
                    log.taskRunID < data.progressId)) {
                    changedIDs.push(data.progressId)
                    data.userId = log.magUserName;
                }
            })
        });
        updateProgress(dataResponse);

        // Exit function if a task is not running
        if (!response.data.liveActivity.length) {
            return;
        }


        // Get updated data every second until task is complete
        setTimeout(
            getActivityUpdates.bind(null, options, updateProgress),
            1000
        );
    })
    .catch(() => showErrorMessage(options.command));