Question

我刚学习redux，这是我第一次在项目中使用它。我试图更新对象数组中的某个值。我的对象的结构是：

students: { 
    loading: false, 
    error: null, 
    data: [{
        id: 1, 
        name: "Bob", 
        email: 'whatever@gmail.com', 
        status: 'out'
    }]
}

以下是我对此的操作，它返回的数据是需要更新的学生的ID。这些工作正常。

export const studentCheckInStart = student => ({
    type: "STUDENT_CHECK_IN_START",  
    student
})

export const studentCheckIn = (id) => {
    return dispatch => {
        dispatch(studentCheckInStart())
        return axios.put('http://localhost:8080/studentList/'+id)
                .then((response) => {      
                    dispatch(studentCheckInSuccess(response.data))
                }).catch(err => {
                    dispatch(studentCheckInError(err))
                })
    }
}

export const studentCheckInSuccess = (data) => {
    return {
        type: STUDENT_CHECK_IN_SUCCESS, 
        payload: data
    }   
}

export const studentCheckInError = (error) => {
    return {
        type: STUDENT_CHECK_IN_ERROR, 
        error
    }
}

我遇到问题的地方是减速机

case "STUDENT_CHECK_IN_SUCCESS":
    let updatedStudent = state.students.data.findIndex((student) => {
        return student.id === action.payload
    })
    console.log(updatedStudent)
    return { 
        ...state, 
        students: {
            ...state.students[updatedStudent],  
            data: {
                status:'in'
            }
        }
    };
    break;
case "STUDENT_CHECK_IN_START":
    return { 
        ...state,
        students: { 
            ...state.students, 
            loading: true 
        }
    }
    break;
case "STUDENT_CHECK_IN_ERROR":
    return { 
        ...state,
        students: {
            ...state.students, 
            error: action.payload, 
            loading: false
        } 
    }
    break;

我正在尝试使用id来定位特定的学生对象，以找到我想要定位的学生的索引。然后将该对象的状态更改为“in”。我知道STUDENT_CHECK_IN_SUCCESS中的内容不正确，我只是不知道该怎么做。

Answer 1

您的州似乎有点复杂。为什么需要在学生对象中加载或错误？除了学生，你在州内还有哪些其他部分？这是我在这种情况下可以想到的一种可能方式（只是相关部分）：

let updatedStudent = state.students.data.findIndex(
    student => student.id === action.payload
);
const newData = [ ...state.students.data ];
newData[ updatedStudent ] = { ...newData[ updatedStudent ], status: "in" }
return { ...state, students: { ...state.students, data: newData } };

如果我认为有更好的方法，我会编辑我的答案。

Answer 2

看起来您的操作并不真正需要所有有效负载，只是签到的学生的id。所以如果您更改了，我认为您可以从您的减速器操作中返回：

return {
  ...state,
  students: {
    ...state.students,
    data: state.students.data.map(s => {
      if (s.id === action.id) {
        return { ...s, status: 'in' };
      }

      return s;
    }
  }
};

这个想法是你需要返回除数据数组之外的所有内容。通过使用map，我们可以返回数据数组的修改版本，其中id与操作中提供的id匹配的学生的状态将更改为in，但其余的学生将更改为def apiconnect(statusvar): def to_serializable(ticketid): return str(ticketid) url = "http://staging2.apiname.com/ticket_api/tickets" data = {'ticket_id' : ticketid, 'direction' : 'up'} headers = {'Content-Type' : 'application/json', 'Authorization' : 'J0XxxxxVRy9hMF9Fo7j5'} r = requests.post(url, data=json.dumps(data), headers=headers) requestpost = requests.post(url, headers = headers, json = data) response_data = requestpost.json() statusvar = (response_data["status"]) messagevar = (response_data["message"]) json.dumps(url,data) global accessResult if statusvar == "successful": accessResult = 1 else: accessResult = 2数据数组保持不变。

React / Redux更新对象数组中的某个值

2 个答案: