javascript - Redux mapStateToProps ไม่กระตุ้นการเรนเดอร์บนอ็อบเจ็กต์สำหรับคีย์

แอปของฉันมีหลายการสนทนา แต่ละการสนทนามีข้อความของตัวเอง

หน้าจอแชท

const mapStateToProps = (state: any) => {
  return {chatMessages: state.chatMessages.messageByConversationId[state.chatMessages.conversationId]};
}

ตัวลดข้อความเมื่อโหลด:

export const subscribeChatMessagesSuccess: Reducer<ImmutableChatMessagesState> = (
  state: ImmutableChatMessagesState,
  { payload }: AnyAction & { payload?: SubscribeChatMessagesSuccessParams }) =>
  payload
    ? {
      ...state,
      requesting: false,
      messageByConversationId: {
        ...state.messageByConversationId,
        [payload.conversationId]: payload.chatMessages
        ,
      },
    }
    : state;

นี่ทำงานได้อย่างสมบูรณ์แบบ! เมื่อมีการวางข้อความ หน้าจอจะเกิดการเรนเดอร์ใหม่

ปัญหาเริ่มต้นเมื่อฉันพยายามเพิ่มข้อความแชท:

export const addChatMessage: Reducer<ImmutableChatMessagesState> = (
  state: ImmutableChatMessagesState,
  { payload }: AnyAction & { payload?: AddChatMessageParams }) => {
  return payload
    ? {
      ...state,
      messageByConversationId: {
        ...state.messageByConversationId,
        [payload.conversationId]: [...state.messageByConversationId[payload.conversationId], payload.chatMessage],
      },
    }
    : state;

คราวนี้ ฉันสามารถเห็นว่าการอัปเดตสำเร็จแล้ว และตัวนับ ChatMessages (บน redux) เพิ่มขึ้น +1 แต่การเรนเดอร์ไม่ได้กระตุ้นให้หน้าจอเรนเดอร์

วิธีที่ถูกต้องในการทำสิ่งนี้คืออะไร?